आप एचटीएमएल 5 फॉर्म सत्यापन संदेशों को कैसे शैलीबद्ध करते हैं?

आप इस तरह कुछ HTML कहते हैं:आप एचटीएमएल 5 फॉर्म सत्यापन संदेशों को कैसे शैलीबद्ध करते हैं?

<form> 
    <input placeholder="Some text!" required> 
    <input type="email" placeholder="An Email!" required> 
    <input type="submit" value="A Button!"> 
</form>

क्योंकि required विशेषताओं की

, नए Webkits और Firefoxes अगली फ़ील्ड पर एक सत्यापन संदेश दिखाना यदि आप इसे खाली छोड़ दें।

वे एक नियम के द्वारा स्टाइल जैसे जा रहा है का जवाब:

div { 
    font: Helvetica; 
}

लेकिन मैं उनके लिए एक अधिक विशिष्ट चयनकर्ता नहीं मिल रहा। क्या किसी को पता है कि किस चयनकर्ता का उपयोग किया जाता है, या इसका उपयोग किया जाएगा, या इससे संबंधित वेबकिट/गीको के लिए भी एक बग रिपोर्ट?

(JSFiddle दिखा रहा है कि वे एक div चयनकर्ता के साथ स्टाइल जा सकता है: http://jsfiddle.net/p7kK5/)

स्रोत

2011-04-19 Rich Bradshaw

नहीं, लेकिन अंत में यह आने की उम्मीद है। spec में थोड़ी सी निगरानी की तरह लगता है - संदेश कहां दिखाई देता है ?, संदेश सेट कहां है (जेएस के बिना)? यहां एक उत्कृष्ट प्रस्ताव है, http://www.broken-links.com/2011/03/28/html5-form-validation/, लेकिन जब तक ऐसा कुछ भी नहीं जोड़ा जाता है, तो आपको चिपकना होगा कस्टम सत्यापन सर्वर-साइड और क्लाइंट-साइड – graham

संभावित डुप्लिकेट [मैं सीएसएस के साथ एचटीएमएल 5 फॉर्म सत्यापन त्रुटि संदेशों को कैसे स्टाइल करूं?] (http://stackoverflow.com/questions/5328883/how-do-i-style- -html-5-form-validation-error-messages-with-css) – Quentin

के लिए और अधिक विशिष्ट चयनकर्ताओं का उपयोग करने की आवश्यकता होगी अद्यतन: क्रोम स्टाइल फ़ॉर्म सत्यापन बुलबुले अब और अनुमति नहीं देता: https://code.google.com/p/chromium/issues/detail?id=259050

Chrome के नवीनतम पुनरावृत्तियों में, समर्थन इन के लिए छद्म चयनकर्ताओं के लिए जोड़ दिया गया है, अर्थात्;

~~::-webkit-validation-bubble{} ::-webkit-validation-bubble-top-outer-arrow{} ::-webkit-validation-bubble-top-inner-arrow{} ::-webkit-validation-bubble-message{}~~

इन के बारे में अधिक जानकारी के लिए, Webkit "Styling Form Controls" trac page की जाँच करें। एक्स-moz-त्रुटिसंदेश जो आपको त्रुटि संदेश है, जो कुछ आप Chrome में कर सकता है के लिए सीएसएस और -webkit-मान्यता-बुलबुला उपयोग कर रहा है के पाठ को बदलने के लिए सक्षम बनाता है विशेषता

साथ ही, फ़ायरफ़ॉक्स तत्व के लिए समर्थन हासिल है -संदेश। x-moz-errormessage on the MDN Docs page के बारे में और देखें।

अभी तक, फ़ायरफ़ॉक्स में त्रुटि बुलबुले को स्टाइल करने का कोई तरीका नहीं है।

स्रोत

2011-05-11 14:02:23 Keithamus

एमडीसी> एमडीएन, है ना? –

जब यह टिप्पणी लिखी गई थी तो मेरा मानना है कि एमडीएन (मोज़िला डेवलपर नेटवर्क) को एमडीसी (मोज़िला डेवलपर सेंटर) कहा जाता था। दोनों एक ही हैं। स्पष्टता के लिए संपादित किया गया। – Keithamus

फ़ायरफ़ॉक्स के बारे में क्या? – WEFX

आप सब कुछ मैं डर .. शरीर> div आदि

स्रोत

2011-04-26 08:54:13 Sheldon

यह मेरा एकमात्र विचार भी था। यकीन नहीं है कि मैं उस मार्ग पर जाना चाहता हूं। मान लीजिए हमें आधिकारिक समर्थन की प्रतीक्षा करनी होगी। –

@ शेल्डन आपका क्या मतलब है? –

आप एचटीएमएल 5 फॉर्म सत्यापन संदेशों को कैसे शैलीबद्ध करते हैं?

उत्तर

संबंधित मुद्दे