मैंने सीएसएस में ऑल्ट एट्रीशन को टारगेट करने की कोशिश की। मेरा समाधान फ़ायरफ़ॉक्स / मोज़िला में काम किया, लेकिन सफारी-क्रोम / वेबकिट में विफल रहता है। क्या ऑल्ट टैग को स्टाइल करने में कुछ गलत है? यदि नहीं, तो आप कैसे मान लेते हैं कि मैं वेबकिट के लिए समस्या निवारण करता हूं।
यहाँ एक उदाहरण है:
सीएसएस
img#logo[alt="Site Title"] { color: #999; font-size: 2em; }एचटीएमएल
<img id="logo" src="" alt="Site Title" width="" height="" />जवाबों:
मैंने इसकी कोशिश की और यह मेरे लिए पूरी तरह से काम करता है। ध्यान दें कि गुण colorऔर font-sizeक्रोम में कोई प्रभाव नहीं पड़ेगा, क्योंकि कोई पाठ प्रदर्शित नहीं होता है। (अगर छवि नहीं मिल सकती है तो फ़ायरफ़ॉक्स ऑल्ट टेक्स्ट दिखाता है।) चौड़ाई प्रॉपर्टी का उपयोग करना, उदाहरण के लिए, यह दिखाता है कि यह ठीक काम करता है। मैं आपको देखने के लिए नीचे अपना कोड पोस्ट करूंगा।
हालाँकि, आपके मूल प्रश्न के लिए, सीएसएस में अनिवार्य रूप से एक "नि: शुल्क पाठ" फ़ील्ड को लक्षित करना दुस्साहस है। सीएसएस में नतीजों के बारे में सोचे बिना एक पूरी विशेषता को बदलना बहुत आसान है (जैसा कि यह स्पष्ट होना चाहिए कि एक वर्ग नाम बदलने के विपरीत)।
इसके अलावा, चूंकि आप पहले से ही एक आईडी को लक्षित कर रहे हैं, इसलिए आपको केवल उस चयनकर्ता का उपयोग करने की आवश्यकता है - एक आईडी का उपयोग प्रति पृष्ठ केवल एक बार किया जा सकता है।
<!DOCTYPE html>
<html>
<head>
<style>img#logo[alt="Site Title"] { width:200px }</style>
</head>
<body>
<img alt="Site Title" src="bullet.png" id="logo" />
</body>
</html>
जैसा कि विशेषता चयनकर्ता डब्ल्यू 3 सी सीएसएस कल्पना में परिभाषित किया गया है, आपको इसका उपयोग करने में सक्षम होना चाहिए। लेकिन ब्राउज़र कार्यान्वयन अलग-अलग होते हैं, और कम या ज्यादा विश्वसनीय होते हैं।
जैसा कि आप CSS विशेषता चयनकर्ता के लिए SitePoint संदर्भ समर्थन पर देख सकते हैं , Webkit का समर्थन छोटी गाड़ी है। आप यह भी देख सकते हैं कि IE का सीएसएस विशेषता चयनकर्ता समर्थन एक संस्करण से दूसरे संस्करण में भिन्न होता है।
इस प्रकार यह चयनकर्ता अभी तक सभी ब्राउज़रों द्वारा समर्थित नहीं है।
अधिक विश्वसनीय तरीके के रूप में, आपको आईडी चयनकर्ता का उपयोग करना चाहिए, जो सभी ब्राउज़रों द्वारा समर्थित है:
# स्लोगो {रंग: # 999; फ़ॉन्ट-आकार: 2em; }
कुछ परीक्षण करने के बाद ऐसा नहीं लगता कि वेबकिट संचालित ब्राउज़र के माध्यम से ऑल्ट टैस्ट टेक्स्ट को स्टाइल करने का समर्थन करते हैं। तो आपके अवलोकन सही और अप्राप्य प्रतीत होते हैं।
CSS चयनकर्ता टैग का चयन कर रहा है, इस प्रकार टैग प्रदर्शित होने के तरीके को प्रभावित करता है। बहुत यकीन है कि अगर आप अपनी छवियों को बंद करते हैं और उस स्थान पर प्रदर्शित वैकल्पिक पाठ को देखते हैं तो यह दिखाई देता है जैसा कि आपकी सीएसएस में लिखा गया है।
आप इसे ठीक करने के लिए उनके लिए वेबकिट परियोजना के लिए एक बग खोल सकते हैं - अगर उन्हें लगता है कि फ़ायरफ़ॉक्स का व्यवहार वही है जो वे वहां करना चाहते हैं।