CSS :target सेलेक्टर की भूमिका

:target सेलेक्टर का उद्देश्य

:target सेलेक्टर URL फ्रैगमेंट (हैश) से मेल खाने वाले ID वाले एलिमेंट को हाइलाइट करता है, जिससे सिंगल-पेज नेविगेशन या FAQ सेक्शन में विज़ुअल फोकस मिलता है।

उदाहरण

<!DOCTYPE html>
<html>
  <head>
    <style>
      :target {
        border: 2px solid #D4D4D4;
        background-color: orange;
        color: white;
      }
    </style>
  </head>
  <body>
    <p>Click any of the subject below.</p>
    <p><a href="#tut1">Maths</a></p>
    <p><a href="#tut2">Java</a></p>
    <p><a href="#tut3">C++</a></p>
    <p><a href="#tut4">C</a></p>
    <p>This is demo text.</p>
    <p>This is demo text.</p>
    <p>This is demo text.</p>
    <p>This is demo text.</p>
    <p>This is demo text.</p>
    <p id="tut1"><b>Maths Tutorial</b></p>
    <p id="tut2"><b>Java Tutorial</b></p>
    <p id="tut3"><b>C++ Tutorial</b></p>
    <p id="tut4"><b>C Tutorial</b></p>
  </body>
</html>

यह ID 1005062674 के समान आलेख है।