छद्म श्रेणी
एक छद्म वर्ग एक चयनकर्ता की स्थिति का प्रतिनिधित्व करता है जैसे:होवर, सक्रिय, अंतिम-चाइल्ड, आदि। ये सिंगल कोलन (:) से शुरू होते हैं।
CSS छद्म वर्ग का सिंटैक्स इस प्रकार है -
:pseudo-class{
attribute: /*value*/
} छद्म तत्व
इसी तरह, एक छद्म तत्व का उपयोग आभासी तत्वों जैसे ::के बाद, ::पहले, ::पहली पंक्ति, आदि का चयन करने के लिए किया जाता है।
ये डबल कोलन (::) से शुरू होते हैं।
CSS छद्म-तत्व का सिंटैक्स इस प्रकार है -
::pseudo-element{
attribute: /*value*/
} उदाहरण
निम्नलिखित उदाहरण CSS छद्म-वर्ग और छद्म-तत्व गुण को दर्शाते हैं।
<!DOCTYPE html>
<html>
<head>
<style>
a:hover{
padding: 3%;
font-size:1.4em;
color: tomato;
background: bisque;
}
</style>
</head>
<body>
<p>You're somebody else</p>
<a href=#>Dummy link 1</a>
<a href=#>Dummy link 2</a>
</body>
</html> आउटपुट
यह निम्नलिखित परिणाम देगा -
उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
p::after {
content: " BOOM!";
background: hotpink;
}
p:last-child {
font-size: 1.4em;
color: red;
}
</style>
</head>
<body>
<p>Anymore Snare?</p>
<p>Donec in semper diam. Morbi sollicitudin sed eros nec elementum. Praesent eget nisl vitaeneque consectetur tincidunt. Ut molestie vulputate sem, nec convallis odio molestie nec.</p>
<p>Hit</p>
<p>Pop</p>
</body>
</html> आउटपुट
यह निम्नलिखित परिणाम देगा -
