1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

CSS font-family for separate options in a html select element.

Discussion in 'HTML & JavaScript' started by MrBlue, Apr 24, 2015.

  1. MrBlue

    MrBlue Senior Member

    Joined:
    Dec 18, 2009
    Messages:
    974
    Likes Received:
    680
    Occupation:
    Web/Bot Developer
    This is how you would change the css font-family for separate options in a html select element.

    Code:
    <select>
    
    
      <optgroup style="font-family:arial">
        <option>Arial</option>
      </optgroup>
    
    
      <optgroup style="font-family:verdana">
        <option>veranda</option>
      </optgroup>
    
    
      <optgroup style="font-family:other">
        <option>other</option>
      </optgroup>
    
    
    </select>
    
    Fiddle:
    Code:
    https://jsfiddle.net/c0ovw6tb/
     
  2. watermelon12

    watermelon12 Newbie

    Joined:
    Jun 7, 2015
    Messages:
    19
    Likes Received:
    4
    Pretty basic, you could also use .classes
     
  3. BeanDH92

    BeanDH92 Regular Member

    Joined:
    Nov 24, 2013
    Messages:
    303
    Likes Received:
    36
    Occupation:
    Web developer
    nothing special
     
  4. MrBlue

    MrBlue Senior Member

    Joined:
    Dec 18, 2009
    Messages:
    974
    Likes Received:
    680
    Occupation:
    Web/Bot Developer
    Thanks for the feedback. I only posted this to help out a fellow member who asked me for assistance.

     
  5. member8200

    member8200 Regular Member

    Joined:
    Aug 9, 2014
    Messages:
    475
    Likes Received:
    33
    Hahaha. If i were you i will use CSS. And use class or tag to group and easily modify the font. Sorry for the word but the way you code is obsolete :D. The best to do it is to organize each code, group them.
     
  6. Hexiuss

    Hexiuss Junior Member

    Joined:
    Aug 18, 2010
    Messages:
    108
    Likes Received:
    15
    ya if you don't use css classes the hardcoded html could unintentionally overwrite css styling and cause problems