पसूडोएलिमेंट before

पसूडोएलिमेंट before टेक्स्ट को एलिमेंट से पहले डालता है। इसका उपयोग केवल content प्रॉपर्टी के साथ मिलाकर किया जाता है, जो उस टेक्स्ट को सेट करती है, जिसे डालना है।

सिंटैक्स

cssसिलेक्टर::before {
  content: 'टेक्स्ट';
}

उदाहरण

आइए ऐसा करते हैं कि जब li पर होवर किया जाए तो उसके शुरुआत में टेक्स्ट डाला जाए:

html<ul>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
</ul>

cssli:hover::before {
  content: '!!!';
}

Результат:

उदाहरण

डाले गए टेक्स्ट पर विभिन्न स्टाइल लागू की जा सकती हैं। आइए, उदाहरण के लिए, इस टेक्स्ट का रंग किसी और रंग में करते हैं:

html<ul>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
  <li>लिस्ट आइटम</li>
</ul>

cssli:hover::before {
  color: red;
  content: '!!!';
}

Результат:

यह भी देखें