पाठ 5 / 28

स्यूडो-क्लास और स्यूडो-एलिमेंट

बिना अतिरिक्त मार्कअप के एलिमेंट की स्थिति और उप-भाग स्टाइल करें।

स्यूडो-क्लास

स्यूडो-क्लास (सिंगल कोलन :) किसी विशेष स्थिति या स्थान को टार्गेट करता है: :hover, :focus, :first-child, :nth-child(2), :last-of-type

स्यूडो-एलिमेंट

स्यूडो-एलिमेंट (डबल कोलन ::) किसी एलिमेंट के उप-भाग को टार्गेट करता है: ::before, ::after, ::first-line, ::placeholder

होवर और जनरेटेड कंटेंट

::before को दिखने के लिए content चाहिए, भले ही वह खाली हो।

button:hover {
  background-color: #1e40af;
}

.required::after {
  content: " *";
  color: red;
}

एक कोलन बनाम दो

स्थिति/स्थान → एकल कोलन (:hover)। उप-भाग/जनरेटेड कंटेंट → डबल कोलन (::before)। ब्राउज़र पुरानी वजहों से :before भी स्वीकारते हैं, पर ::before लिखें।