वर्ग विशेषता

6.1 वर्ग विशेषता और शैली टैग

लेकिन वह सब नहीं है। सैकड़ों "शैलियों" का आविष्कार होने के बाद, सवाल उठता है: उनका उपयोग कैसे करें? और फिर उन्हें "कक्षाओं" में समूहीकृत करने का विचार आया। बेशक, ये जावा के समान वर्ग नहीं हैं। बस विशेष शैली समूह।

और अगर "कक्षाओं" का उपयोग करने से पहले आपके पास एक तस्वीर थी:

<img src="logo.png" style="width=100px;height=100px;opacity=0.5">

अब इसे इस प्रकार लिखा जा सकता है:

<img src="logo.png" class="picture">

<style>
    img.picture {
        width=100px;
        height=100px;
        opacity=0.5
    }
</style>

हमने एक विशेष बनाया «style» pictureऔर शैली मूल्यों को style. और फिर हमने टैग के साथ <img> और "शैली" तस्वीर को बांध दिया class।

6.2 चयनकर्ता, चयनकर्ताओं के प्रकार

classesअलग-अलग प्रदान की गई इन शैलियों को या के रूप में जाना जाता है selectors। उनकी कई महत्वपूर्ण विशेषताएं हैं।

एक html-elementके पास कई चयनकर्ता हो सकते हैं। उनके नाम एक स्थान के साथ दर्शाए गए हैं। उदाहरण:

<img src="logo.png" class="picture main">

चयनकर्ताओं को यहां छूने का एक कारण यह है कि उन्हें स्वचालित रूप से लागू किया जा सकता है। और यह उपयोगी संपत्ति भविष्य में बहुत बार उपयोग की जाएगी। जावा डेवलपर्स सहित।

यहाँ उनकी एक छोटी सूची है:

* {
  margin: 0;
  padding: 0;
}

#img123 {
   width:100px;
   height 100px;
}

table {
   color: black;
}

table.important {
   color: red;
}

.picture {
  opacity: 0.5
}

main article {
  color: blue;
}

a:link {
color: blue;
}

a:visited {
color: red;
}

input[type=radio]:checked {
 border: 1px solid black;
}

div:hover {
  background: red;
}

ul li:first-child {
 border-top: none;
}

आपको यह सब याद रखने की जरूरत नहीं है। लेकिन यह अच्छा होगा यदि आप एक दो बार इस तालिका का अध्ययन करें और यह सब आपके सिर में जमा हो जाए। आधुनिक जीवन में वेब के बिना, कहीं नहीं, और वेब पर - चयनकर्ताओं के बिना कहीं नहीं।