#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Posts
    1
    Rep Power
    0

    css form element colours


    Hi,

    Can anyone point me in the direction of some good tutorials on colouring <form> elements such as textareas and menus etc.

    Im kinda after the effect that they have used on UDZone (www.udzone.com)

    Ive been able to colour the textareas and choose border colour and solid etc. but im struggling to get one style to affect all the elements at the same time, especially the list menus and radios etc.

    Done this so far:

    <style type="text/css">
    <!--
    input, select, textarea, submit, list, menu, reset
    {background-color:#ffffff; border: #006699 1px solid; font-size:10pt; font-family:Ariel,verdana}

    -->
    </style>


    ........which is fine for textareas for bugger all use for anything else..

    Any help would be appreciated.
    Matt
  2. #2
  3. superficial
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2002
    Location
    Peterborough, England
    Posts
    188
    Rep Power
    13
    ive got one one on my site, www.designplace.org

    _______________
    Matt
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Inside the GNU/Hurd kernel
    Posts
    492
    Rep Power
    13
    Using CSS2,you can make CSS for input elements like this:
    input[type="checkbox"] {
    }
    input[type="button"] {
    }
    etc.

    You can also use pseudo classes,this for example will change it when the button has focus (is active):
    input[type=button]:active {
    }
    etc.

    Here comes the interesting part of using pseudo elements.You can set a green background for options,and a yellow background when it is checked:
    option {
    background-color:green;
    }

    option:checked {
    background-color:yellow;
    }

IMN logo majestic logo threadwatch logo seochat tools logo