border-bottom

The border of an element resides between the padding and margin areas of the element container. Border properties may be set as a single value for all four sides, or as individual values for each side. Border values are not inherited: they are valid only in that instance of the element. border-bottom This property is used to set the values of the border. Values for the width, style, and color may be defined. border-bottom values border-width This value sets the width of the border surrounding the element or object. The values used are valuethin, medium, thick, or a length measurement. The length measurement options for this value are: • mm millimeters. • cm centimeters. • in inches. • pt points, which is a way of measuring the font size. One point is 1/72 (one seventy-second) of an inch. • pc picas, which is yet another way of measuring font size. One pica is equal to 12 points. • px pixels, which is one screen element. The display you're looking at is comprised of thousands of individual dots, each of which can change in color and luminosity to achieve the desired image. Each of these dots is referred to as a pixel. • ex x-height settings, which is the height of the font's lower case letter 'x'. • em em setting. One em is equivalent to the width of a capital letter in the chosen font. Millimeters, centimeters, inches, points, and picas are considered to be absolute lengths because you're specifying the exact size of the value. Relative units such as em and ex are interpreted as references to the parent font size. Percentage This value sets the length for the distance between the element (the 'thing') and the inside of the border as a percentage of that element. border-style This value sets the style or pattern used to fill the border. The options available for this value are none, dotted, dashed, solid, double, groove, ridge, inset, or ourset. border-color This value sets the color of the bottom border. The value can be a hexadecimal color value ("#FF0000" for red, or "#0000FF" for blue) or a named value, such as "RED", or "BLUE". EXAMPLES: img.logo {border-bottom: 15px solid #FF000} This example applies to the image represented by the CLASSID 'logo'. It assigns a border of 15 pixels along the bottom of the image. The border is solid, and its color is red, which is represented by the RRGGBB value '#FF0000'. P {border-bottom: 2em ridge yellow} This example puts a border along the bottom of the paragraph which is 2 EM units wide, with a ridged effect. The 'yellow' is a named color, and will obviously be the color of the border.