Pseudoklassen

Das a-Element (Link-Element) kann durch in CSS definierte Pseudoklassen unterschiedlich angezeigt werden.

a, a:link = normaler Hyperlink
a:visited = besuchter Hyperlink
a:hover = Mauszeiger befindet sich gerade über dem Hyperlink
a:active = beim Klick auf den Hyperlink

HYPERLINK

a.hyper {
    color: #ff6677;
    text-decoration: none;
    background-color:#eee;
}
a.hyper:hover { 
    color: #333;
    background-color:#ccc;
  }
a.hyper:visited { 
    color: #ff6677;
  } 
a.hyper:active { 
    color: #000;
  }

Alle Pseudoklassen

:active
:after
:before
:first-child
:first-letter
:first-line
:focus
:hover
:lang
:link
:visited

Pseudoelement können auf alle Tags angewendet werden.

Pseudoklassen Beispiele

First Letter

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed imperdiet vulputate mauris. Fusce commodo congue nisl. Donec accumsan. Aenean porta varius mauris. Duis libero. Proin in dui a metus fermentum posuere. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam tempus felis id purus. Nunc vitae risus. Morbi tempor ultricieselit.

Ut ac odio. In in augue sit amet nunc lobortis cursus. Quisque adipiscing lectus sed justo. Vivamus volutpat libero ut urna. Integer vel turpis vel leo fringilla tincidunt. Nulla luctus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur a augue vel metus euismod tempus. Nulla facilisi.

p:first-letter { 
font-family: serif;	
font-size: 40px;	
font-weight: bold;	
}

First Line

p:first-line {font-weight:bold;}

First Letter und First Line können auf alle Elemente oder als Klasse angewendet werden.