[thelist] <option value= > Specifying a Font Face

.jeff jeff at members.evolt.org
Mon Mar 11 01:18:02 CST 2002


sandra,

><><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> From: Sandra L
>
> Have come up blank in trying to set more than one font
> face in the option values in a List. I have found how
> to set a different font color and/or background color
> for each item, but not the font face. For example I
> would like the first option to be "Arial" in the Arial
> font, second option "Times" in the Times font etc.
><><><><><><><><><><><><><><><><><><><><><><><><><><><><><

<option
 style="background-color: #ff99ff;
        color: #000000;
        font-family: arial"
 value=""
>text</option>

<option
 style="background-color: #ff99ff;
        color: #000000;
        font-family: times new roman"
 value=""
>text</option>

be sure that whenever you define a color you preface it with a hash (#).

><><><><><><><><><><><><><><><><><><><><><><><><><><><><><
> <select name="menu" size=1
> style="font-family: comic sans ms"
> style="color: #FFFF00"
> style="border: outset"
> style="font-size: 9"
> style="background: #CC99FF">
><><><><><><><><><><><><><><><><><><><><><><><><><><><><><

you should only set a single "style" attribute.  separate each of the values with a semi-colon (;).

<select
 name="menu"
 size="1"
 style="font-family: comic sans ms;
        color: #FFFF00;
        border: outset;
        font-size: 9;
        background: #CC99FF">

also, you should be careful to make sure that each attribute value has quotes, preferably double-quotes ("), around it.  color values should be in lower-case.  measurements should have some sort of measurement designator (pt, px, em, %) assigned to them as well:

 style="font-family: comic sans ms;
        color: #ffff00;
        border: outset;
        font-size: 9px;
        background: #cc99ff"

you might even find it easier if you create a class in a <style> block in the head of your document and apply the class to your element:

<style type="text/css">
<!--
  .menu {
    font-family: comic sans ms;
    color: #ffff00;
    border: outset;
    font-size: 9px;
    background: #cc99ff;
  }
-->
</style>

<select
 name="menu"
 size="1"
 class="menu">

good luck,

.jeff

http://evolt.org/
jeff at members.evolt.org
http://members.evolt.org/jeff/




More information about the thelist mailing list