ड्रॉप डाउन सूची आइटम के फ़ॉन्ट-परिवार को कैसे बदलें?

मेरे पास एक ड्रॉप-डाउन है जो फ़ॉन्ट परिवारों को सूचीबद्ध करता है। ताहोमा, एरियल, वर्दान, इत्यादि की तरह। मैं प्रत्येक ड्रॉप-डाउन आइटम के फ़ॉन्ट-फ़ैमिली को उस मान के अनुसार बदलना चाहता हूं जो उसके प्रतिनिधित्व करता है। फ़ोटोशॉप की तरह ही यह करता है।ड्रॉप डाउन सूची आइटम के फ़ॉन्ट-परिवार को कैसे बदलें?

मैंने प्रत्येक ड्रॉप-डाउन आइटम के लिए सीएसएस बदल दिया लेकिन यह केवल फ़ायरफ़ॉक्स पर काम करता है। यह किसी अन्य ब्राउज़र पर काम नहीं करता है।

मैं किसी भी jQuery प्लगइन का उपयोग नहीं करना चाहता।

स्रोत

2012-05-22 Mohal

है ऐसा इसलिए है क्योंकि select तत्वों बच्चों (option रों) वास्तव में stylable नहीं हैं और लगता है कि spec के उस हिस्से को अनदेखा करने के लिए फ़ायरफ़ॉक्स एकमात्र ब्राउज़र प्रतीत होता है।

कामकाज अपने select तत्व को एक कस्टम विजेट के साथ प्रतिस्थापित करना है जो केवल स्टाइल करने योग्य तत्वों और इंटरैक्टिविटी के लिए शायद थोड़ा जावास्क्रिप्ट का उपयोग करता है। यहाँ क्या किया है की तरह: ~~http://jsfiddle.net/sidonaldson/jL7uU/~~ या http://jsfiddle.net/theredhead/4PQzp/

स्रोत

2012-05-22 05:30:11 Kris

फ़ायरफ़ॉक्स वास्तव में spec का उल्लंघन नहीं कर रहा है। इसके बजाय, चश्मा इस मुद्दे के बारे में चुप हैं कि 'विकल्प' तत्व शैलीबद्ध हैं (हालांकि प्राकृतिक उम्मीद यह होगी कि उन्हें किसी भी अन्य तत्व की तरह स्टाइल किया जा सकता है, लेकिन कार्यान्वयन अक्सर उन प्रौद्योगिकियों का उपयोग करते हैं जो इसकी अनुमति नहीं देते हैं)। –

मुझे याद है कि फॉर्म नियंत्रण प्लेटफॉर्म मूल होना चाहिए। ऐसा लगता है कि मैं कहां पढ़ता हूं, ऐसा नहीं लगता है, और मैं बस इसे पढ़ने के बारे में गलत हो सकता हूं। फिर भी, अधिकांश ब्राउज़र प्लेटफार्म देशी रूप नियंत्रणों का उपयोग करते हैं जहां तक मैं कह सकता हूं। – Kris

http://jsfiddle.net/sidonaldson/jL7uU/ लिंक काम नहीं कर रहा है –

-2

<select> 
    <option style="font-family: 'Comic Sans MS'">Comic Sans MS</option> 
    <option style="font-family: Arial">Arial</option> 
    <option style="font-family: 'Times New Roman'">Times New Roman</option> 
    </select>

आप कर सकते हैं ओ इस साइट के माध्यम से यू विचार

धन्यवाद

स्रोत

2012-05-22 05:22:29 Dolly

यह सफारी –

में काम नहीं कर रहा इसकी नहीं एक समाधान – Ylama

downvote, नहीं एक समाधान – walv

क्या आप सीएसएस में कर सकते हैं कि तुम क्या वर्णित है का आनंद प्राप्त होगा: font-family की स्थापना option तत्वों पर, और इसमें सीमित ब्राउज़र समर्थन है। ब्राउज़र select तत्वों को नियमित रूप से या पूरी तरह से सीएसएस से प्रतिरक्षा करने वाले दिनचर्या का उपयोग कर लागू कर सकते हैं।

वर्कअराउंड select तत्व, जैसे कि रेडियो बटन के सेट के अलावा कुछ और उपयोग करना है, लेकिन यह निश्चित रूप से ड्रॉपडाउन मेनू से अलग किया जाएगा। फिर आप उदाहरण का उपयोग कर सकते हैं

<div><input type="radio" name="font" value="Tahoma" id="tahoma"> 
<label for="tahoma" style="font-family: Tahoma">Tahoma</label></div> 
...

स्रोत

2012-05-22 05:26:18

-4

यह हो के रूप में यह पूरा करने के आप यह अनुमान लगा देना चाहिए:

<select> 

    <option value="Arial">First</option> 
    <option value="Verdana">Second</option> 


    </select> 




    $(function() { 
    $('select > option').hover(function() { 
     $(this).parent().css({fontFamily:$(this).val()})  
})    
})

JSFIDDLE

स्रोत

2012-05-22 05:27:39 defau1t

उन्होंने कहा कि वह jquery का उपयोग नहीं करना चाहते हैं। – khurram

यह समझने योग्य होगा कि यह क्रॉस-ब्राउज़र था, लेकिन जब मैंने अभी कोशिश की तो क्रोम में काम नहीं किया। –

-3

इस प्रयास करें:
1. विकल्पों में से अपनी सूची कि desplayed किया जाएगा बिल्ड:

<html> 
    <head> 
    <style> 
.styled-select { 
     overflow: hidden; 
     height: 30px; 
} 
.styled-select select { 
     font-size: 14pt; 
     font-family:"Times New Roman",Times,serif; 
     height: 10px; 
} 
</style> 
    <title></title> 
    </head> 
    <body> 
    <div class="styled-select"> 
     <select> 
     <option selected="selected" >One</option> 
     <option >Two</option> 
     </select> 
    </div> 
    </body> 
</html>

स्रोत

2014-05-23 14:12:14 DevAshish

आप निम्नलिखित तरीके से एक HTML लटकती के लिए फोंट सेट कर सकते हैं अपने ड्रॉपडाउन में, लेकिन किसी भी विकल्प में किसी भी स्टाइल/कक्षाओं को लागू न करें। PHP में मैं विकल्पों की अपनी सूची को एक चर में संग्रहीत करता हूं और उसके बाद उस ड्रॉपएबल में विकल्प जोड़ने के लिए उस चर का उपयोग करता हूं जो मैं नीचे दिखाऊंगा।
2. जब आप वास्तव में, पेज में लटकती डालने का चयन टैग का उपयोग और उस टैग के अंदर कुछ सीएसएस स्टाइल रखना चाहते हैं जैसे मैं नीचे दिखाया गया है:

<SELECT style='font-size: 10px; font-family: "Verdana", Sans-Serif;' name='???????'> 
<?php echo $your_variable_containing_dropdown_content; ?> 
</SELECT>

कि मेरे लिए 100% ठीक काम करता है जिस वेबसाइट पर मैं वर्तमान में काम कर रहा हूं। यह सिर्फ स्टाइल है जिसे मैंने अपने पृष्ठ में उपयोग किया है, लेकिन यह हो सकता है कि आपको यह भी हो।

स्रोत

2016-09-08 17:01:47

ड्रॉप डाउन सूची आइटम के फ़ॉन्ट-परिवार को कैसे बदलें?

उत्तर

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