MCQs Test!! VB Basic Test !! Essentials of VB !! Creating User Services !! function !! Anatomy !! GK March-2019 !! DATA TYPES IN JAVA !! Classes ,Constructor ,Methods,Inheritance !! Ecology-I !! Biology 2019 !! Gk april 2019 !! Biology (living world) !! Plant anatomy !! CELL STRUCTURES AND FUNCTION !! General biology !! Human physiology !! Data structure !! Ecology-II !! GK TEST !! Reproduction in plants !! Human reproduction !! The ABC of C !! Operating system set1 !! Operating system set2 !! Gk and current affairs !! Animal kingdom !! Number system !! Animal kingdom-II !! Gk TEST-III !! Number series !! Microorganisms !! Interview question in c !! Time and Work !! Percentage !! General history !! Average !! Cells !! Locomotion and Movement !! paging !! Bacteriology !! Page replacement policy !! Secondary memory and Disk scheduling !! Introduction of Nervous System and neurons !! Plant harmones !! Transport and Mineral Nutrition in Plants !! Neurotransmitters !! Modern Indian History !! Photosynthesis in Plants !! Modern Indian History-II !! Plant respiration !! Environment & Biodiversity !! Environment & Biodiversity - II !! Algae, Bryophytes, Pteridophytes !! Area !! Cricket !! Days of the Year (India and the World) !! Plant Pathology - I !! Indian Transport System !! Plant Pathology - II !! Aptitude !! Biology !! Botany !! C language !! Computer Science !! Core Java !! Gate !! GK !! Mysql !! Operating system !! Physics !! VB-Visual Basic !! Zoology

CSS Tutorials

Pesudo Classes In CSS
Previous Home Next

A pseudo-class is similar to a class in HTML, but it’s not specified explicitly in the markup.Some pseudo-classes are dynamic — they’re applied as a result of user interaction with the document. A pseudo-class starts with a colon (:). No whitespace may appear between a type selector or universal selector and the colon, nor can whitespace appear after the colon.A pseudo-class is used to define a special state of an element.

Pseudo-classes allow you to format items that are not in the document tree. They include:

  • :link: Basically it is the selector for normal links
  • a.first:link {
    color: #FF0000;
    }
    
  • :visited: Basically it is the selector for visited links
  • a.second:visited {
    color: blue;
    }
    
  • :hover: Basically it is the selector for hover state.In which selects links on mouse over.
  • a.third:hover {
    color: green;
    }
    
  • :active:Active is the selector for active links.It gets applied when an element is in an active state.
  • a.fourth:active {
    color: #FF0000;
    }
    

     

  • :focus: It is only applied to interactive elements like links, buttons and form elements. The styles are applied as soon as the element receives focus
  • a.focus{
    color:#FF0000;
    }
    
Simple Example
<html>
<head>
<style>
a.first:link {
color: #FF0000;
}
a.second:visited {
color: blue;
}
a.third:hover {
color: green;
}
a.fourth:active {
color: #FF0000;
}
</style>
</head>
<body>
<p><a class="first" href="introduction_of_css">CSS Introduction</a></p>
<p><a class="second" href="lists_in_css"> Lists in CSS</a></p>
<p><a class="third" href="fonts_in_css"> Fonts in CSS</a></p>
<p><a class="fourth" href="dimensions_in_css"> Dimensions in CSS</a></p>
</body>
</html>
Previous Home Next