पseudoclass focus-within

पseudoclass focus-within उन तत्वों की शैली निर्धारित करता है जो फोकस में हैं। पseudoclass focus के विपरीत, जो सीधे तत्व की शैली निर्धारित करता है, focus-within मूल तत्व के लिए शैली निर्धारित करता है।

वाक्य - विन्यास

चयनकर्ता:focus-within {

}

उदाहरण

आइए मूल तत्व की पृष्ठभूमि का रंग नीला निर्धारित करें, जब इसका चाइल्ड इनपुट तत्व फोकस में हो:

<div>
	अपना नाम दर्ज करें: <input name="user">
</div>

div {
	width: 300px;
	height: 50px;
	padding: 10px;
}
div:focus-within {
	background-color: #C2DDFD;
}

यह भी देखें

पseudoclass :indeterminate,
जो अनिश्चित स्थिति वाले स्विचों की शैली निर्धारित करता है
पseudoclass :default,
जो डिफ़ॉल्ट तत्वों की शैली निर्धारित करता है
पseudoclass :fullscreen,
जो फुलस्क्रीन मोड वाले तत्वों की शैली निर्धारित करता है
पseudoclass :placeholder-shown,
जो प्लेसहोल्डर टेक्स्ट दिखाए जाने पर तत्वों की शैली निर्धारित करता है
संपत्ति caret-color,
जो इनपुट में टेक्स्ट कर्सर का रंग निर्धारित करती है