2012-01-15 5 views
8

CSS3 छद्म-तत्व selection हाइलाइट के सभी हिस्सों को क्यों नहीं बदलता है? आप इस स्क्रीनशॉट मैं पृष्ठ के भाग का चयन किया है में देख सकते हैं, और चयन के कुछ हिस्सों डिफ़ॉल्ट चमकदार नीली रंग के होते हैं के रूप में:CSS3 छद्म :: चयन सभी भागों के लिए रंग क्यों नहीं बदलता है?

enter image description here

यह सीएसएस है कि मैं का उपयोग कर रहा है, यह पर है मेरी सीएसएस फ़ाइल के शीर्ष:

::selection { background: #3B3B3B; color: #fff; } 
::-moz-selection { background: #3B3B3B; color: #fff; } 

यह आदानों (पाठ, चेक बॉक्स, आदि) और सफेद स्थान परिवर्तन नहीं करता है के लिए मुख्य आकर्षण की तरह लगता है। क्या किसी को पता है कि यह क्यों है, और पृष्ठ के भाग प्रत्येक भाग के लिए इसे बदलने का कोई तरीका है, इसलिए हाइलाइट रंग सुसंगत है? मैं क्रोम का उपयोग कर रहा हूँ।

उत्तर

11

::selection छद्म-तत्व क्रोम/सफारी में ठीक से काम नहीं करता है। <input> तत्व मानक हाइलाइट रंग होंगे। यह एक बहुत ही पुरानी है और अभी भी बकाया बग है:

https://bugs.webkit.org/show_bug.cgi?id=38943

केवल वैकल्पिक हल के साथ मैं <input> तत्वों के बजाय contenteditable तत्वों का उपयोग किए आने के लिए कर लिया है। http://jsfiddle.net/ThinkingStiff/FcCgA/
और एक पोस्ट मैं इसके बारे में लिखा है::

यहाँ एक डेमो मैं बनाया https://stackoverflow.com/a/8529323/918414

+0

आह, मैं देख रहा हूँ। इसके लिए धन्यवाद। उम्मीद है कि वेबकिट टीम जल्द ही इसे ठीक करेगी, क्योंकि यह एक बहुत ही कष्टप्रद बग है। वैसे, आप अपने जेएसफिल्ड डेमो पर उस छोटे स्टैक ओवरफ़्लो बैनर को कैसे प्राप्त करते हैं जिसे आपने ऊपर से जोड़ा है? मुझे आपके जेएसफ़िल्ड के HTML बॉक्स में कहीं भी इसके लिए मार्कअप नहीं दिखाई देता है ... – Nathan

+0

@Nathan HTML बॉक्स में नीचे स्क्रॉल करें। – ThinkingStiff

+0

ओह। यह नहीं देखा कि: पी – Nathan

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