Skip to content

Instantly share code, notes, and snippets.

@supercodingninja
Created May 30, 2017 04:30
Show Gist options
  • Save supercodingninja/3ff473950832a7ff5eac38b856b434f5 to your computer and use it in GitHub Desktop.
Save supercodingninja/3ff473950832a7ff5eac38b856b434f5 to your computer and use it in GitHub Desktop.
null created by supercodingninja - https://repl.it/IWxg/1
p {
font-family: Garamond, serif;
}
#intro {
font-weight: bold;
color: #000000;
}
div p {
color: #7AC5CD;
}
li p {
font-family: Verdana, sans-serif;
color: #000000;
}
.list_item {
font-family: Vivaldi, cursive;
}
#summary {
font-size: 20px;
color: #000000;
}
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Ultimate Text Challenge</title>
</head>
<body>
<p>Introduction: Cascading with CSS</p>
<div>
<p>Synopsis: When you set a property of a selector like 'p' to a certain value, that value applies to <em>all</em> p tags.
If, however, you change that same property to a different value for a more specific instance of p,
that change will <em>override</em> the 'general rule'.
</p>
<ul>
<li><p>If you say p { font-family: Garamond}, all 'p's will have the font Garamond.</p></li>
<li><p>BUT if you say li p {font-family: Verdana}, 'p's outside of 'li's will be
in Garamond, and 'p's INSIDE 'li's will be in Verdana.
</p></li>
<li><p>The more specific your selectors are, the higher importance CSS gives to the styling you apply!</p></li>
</ul>
</div>
<p>Summary: Greater specificity makes CSS prioritize that particular styling.</p>
</body>
</html>
Empty file
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment