Skip to content

Instantly share code, notes, and snippets.

@techxdeveloper

techxdeveloper/css_pseudo_class_selector (active and hover).html

Created October 1, 2017 11:17
Show Gist options
  • Save techxdeveloper/aaf0571384fdb797976e1e724568fbb7 to your computer and use it in GitHub Desktop.
Save techxdeveloper/aaf0571384fdb797976e1e724568fbb7 to your computer and use it in GitHub Desktop.
Download ZIP
CSS Psuedo Class Selector (:active and :hover)
Raw
css_pseudo_class_selector (active and hover).html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS Psuedo Class Selector (:active and :hover)</title>
<style>
h1 {
color: #00bdc4;
border-bottom: 1px solid #bdbdbd;
padding-bottom: 20px;
}
p {
display: none;
padding: 20px;
background-color: #f5f5f5;
color: #757575;
}
div {
cursor: pointer;
}
div:hover p {
display: block;
}
</style>
</head>
<body>
<div>
<h1>CSS Psuedo Class Selector (:active and :hover)</h1>
<div> Hover Me!!!
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias quaerat, ad laborum atque quasi adipisci, ducimus quo hic ratione autem odit totam ipsum odio, praesentium cum voluptate repudiandae quia nihil.</p>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment