CSS id సెలెక్టర్

id ఎంపికదారి

id ఎంపికదారి ప్రత్యేక id కలిగిన హెచ్ఎంఎల్ ఎలిమెంట్లకు ప్రత్యేక స్టైల్స్ నిర్వచించగలదు.

id ఎంపికదారి "#" తో నిర్వచించబడుతుంది.

ఈ రెండు id ఎంపికదారులలో, మొదటి రెడ్ రంగులో మేలాస్తు నిర్వచిస్తుంది, రెండవ హరిత రంగులో మేలాస్తు నిర్వచిస్తుంది:

#red {color:red;}
#green {color:green;}

ఈ హెచ్ఎంఎల్ కోడ్లో, id అట్రిబ్యూట్ ఉన్న రెడ్ ప్యారాగ్రాఫ్ ఎరుపు రంగులో కనిపిస్తుంది, గ్రీన్ అట్రిబ్యూట్ ఉన్న ప్యారాగ్రాఫ్ హరిత రంగులో కనిపిస్తుంది.

<p id="red"> ఈ ప్యారాగ్రాఫ్ ఎరుపు రంగులో ఉంటుంది.</p>
<p id="green"> ఈ ప్యారాగ్రాఫ్ హరితం.

గమనిక:id అట్రిబ్యూట్ ప్రతి హెచ్ఎంఎల్ డాక్యుమెంట్లో ఒకసారి మాత్రమే ఉండవచ్చు. ఎందుకు ఆరాయాలి తెలుసుకోవాలి, దానిని పరిశీలించండి: XHTML: వెబ్సైట్ పునర్నిర్మాణం。

id ఎంపికదారి మరియు పరివర్తనా ఎంపికదారులు

ఆధునిక లేఆఉట్లో, id ఎంపికదారి పరివర్తనా ఎంపికదారులను సృష్టించడానికి సాధారణంగా ఉపయోగిస్తారు.

#sidebar p {
	font-style: italic;
	text-align: right;
	margin-top: 0.5em;
	}

పైని స్టైల్స్ మాత్రమే id ఉన్న సైడ్బార్ అనే ఐడి లోని ప్యారాగ్రాఫ్లకు వర్తిస్తాయి. ఈ మేలాస్తు ప్రకరణం కాబట్టి కాక ఉంటుంది కానీ అది ఒక పట్టిక లేదా టేబల్ సెల్ కావచ్చు, లేదా మరొక పట్టిక లేదా బ్లాక్ గ్రూప్ అయినా ఉండవచ్చు. అలాగే ఇన్లైన్ ఎలిమెంట్గా కూడా ఉండవచ్చు, ఉదాహరణకు <em></em> లేదా <span></span>, కానీ ఈ వినియోగం నిషేధించబడింది ఎందుకంటే నాణ్యమైన కారణం ఉంది (మీరు ఎందుకు మర్చిపోయారో తెలుసుకోవడానికి మార్గాన్ని పరిశీలించండి): XHTML: వెబ్సైట్ పునర్నిర్మాణం）。

ఒక ఎంపికదారి, అనేక వినియోగాలు

ఇది సైడ్బార్ అనే గుర్తుంచుకున్న మేలాస్తులు డాక్యుమెంట్లో ఒకసారి మాత్రమే కనిపించవచ్చు, అయితే ఈ id ఎంపికదారి అనేది పరివర్తనా ఎంపికదారుగా అనేక సార్లు ఉపయోగించబడవచ్చు:

#sidebar p {
	font-style: italic;
	text-align: right;
	margin-top: 0.5em;
	}
#sidebar h2 {
	font-size: 1em;
	font-weight: normal;
	font-style: italic;
	margin: 0;
	line-height: 1.5;
	text-align: right;
	}

在这里，与页面中的其他 p 元素明显不同的是，sidebar 内的 p 元素得到了特殊的处理，同时，与页面中其他所有 h2 元素明显不同的是，sidebar 中的 h2 元素也得到了不同的特殊处理。

单独的选择器

id 选择器即使不被用来创建派生选择器，它也可以独立发挥作用：

#sidebar {
	border: 1px dotted #000;
	padding: 10px;
	}

根据这条规则，id 为 sidebar 的元素将拥有一个像素宽的黑色点状边框，同时其周围会有 10 个像素宽的内边距（padding，内部空白）。老版本的 Windows/IE 浏览器可能会忽略这条规则，除非你特别地定义这个选择器所属的元素：

div#sidebar {
	border: 1px dotted #000;
	padding: 10px;
	}

相关内容

如果您需要更深入地学习关于 ID 选择器的知识，请阅读 CodeW3C.com 的高级教程：CSS ID సెలెక్టర్ వివరణ。