Below is the code for this classification of all text form inputs (text boxes). We will go through this a line at a time, and I will explain each part.
INPUT.TEXT{
font-family:TrebuchetMS;
font-size:9pt;
font-weight:bold;
background-color:336699;
border-color:336699;
border-style:inset;
border-width:2px;
color:FFFFFF;
}
INPUT.TEXT{
This is the first line in your definition of this sub-class (a part of a css style for an entire page). The INPUT.TEXT tells the browser that it is defining the properties for all text form inputs. The bracket ({) tells the browser to start reading the following as specific definitions for the text form inputs.
font-family:TrebuchetMS;
The font-family property is basically the same as the font FACE property in HTML. It tells the browser what font type the text is to be shown in. As in HTML, you can also have more than one font type seperated by a comma (,).
font-size:9pt;
The font-size property is self-explanatory, it defines the size of the text for that element. 9pt is the same as how you would format text in a program like Microsoft Word. There are also a number of other ways to define font-size using CSS.
font-weight:bold; The font-weight property defines the width, more commonly boldness, of the font that is being used. You have a number of options for different values for this property as well, they are outlined below :
background-color:336699; This property, the background-color property sets the color of the text box, or submit box, behind the text. It can be defined using HEX values (FFFFFF), or by using color names (red, blue, aqua).
border-color:336699;
The border-color property defines the color surrounding the box. This is essentially the outline of the box. It can be set the same way as the background color, using either HEX values, or color names.
border-style:inset;
This property defines the border-style that is to be used for the element. There are a number of different options for this property, as outlined below :
border-width:2px; The border-width property sets the width of the border for the specific element. It can be defined using pixel measurements, or with the following generic defs:
color:FFFFFF; This defines the forefront color, or as in this situation, the text color. It can be set using HEX codes, or generic color name codes.
}
This closes the sub-class for INPUT.TEXT.