 /* Internal links, beginning with "#" */

a[href^="#"] { background-color: gold; }

 /* Links with "example" anywhere in the URL */
a[href*="example"] { background-color: silver; }
 /* Links with "insensitive" anywhere in the URL, regardless of
capitalization */
a[href*="insensitive" i] { color: cyan; }
 /* Links that end in ".org" */
a[href$=".org"] { color: red; }

<ul> <li><a href="#internal">Internal link</a></li>

<li><a href="[Link] link</a></li>
<li><a href="#InSensitive">Insensitive internal link</a></li>
<li><a href="[Link] org link</a></li>
</ul>
 A CSS pseudo-element is used to style
specified parts of an element.
For example, it can be used to:
 Style the first letter, or line, of an element
 Insert content before, or after, the content of an
element
selector::pseudo-element { property: value; }
 .ribbon { background-color: #5BC8F7; }

.ribbon::after {
content: "This is a fancy orange box.";
background-color: #FFBA10;
border-color: black;
border-style: dotted; }

<span class="ribbon">Look at the orange box after this text.

</span>
 <style type="text/css">
p::before {
    content: "String ... ";
}
</style>
<p>paragraph content</p>
 ::selection {
color: #00CCFF;
background: #CC6633;
}
<h1>Select some text on this page:</h1>
<p>This is a paragraph.</p>
 A pseudo-class is used to define a special
state of an element.
 For example, it can be used to:
 Style an element when a user mouses over it
 Style visited and unvisited links differently
 <p>
This paragraph contains a link:
<a href="#">This link will turn red while you click on it.</a>
The paragraph will get a gray background while you click on it or
the link.
</p>

a:link { color: blue; } /* Unvisited links */

a:visited { color: purple; } /* Visited links */
a:hover { background: yellow; } /* Hovered links */
a:active { color: red; } /* Active links */
p:active { background: #eee; } /* Active paragraphs */
 <style type="text/css">
input:checked {
    cursor:crosshair;
}
</style>
<input type="checkbox" name="cb1">
<input type="checkbox" name="cb2"
checked="checked">