styles.css

The style sheet used for this project is shown in Example 21-13. There are a number of sets of declarations, as follows:

*

Sets the default font family and size for the project using the universal selector.

body

Sets the width of the project window, centers it horizontally, specifies a background color, and gives it a border.

html

Sets the background color of the HTML section.

img

Gives all images a border, a shadow, and a righthand margin.

li a, and .button

Remove underlines from hyperlinks in all <a> tags that are within a <li> element, and all elements employing the button class.

li:ahover and .button:hover

Set the color in which <li> elements and the button class should display text when hovered over.

.appname

Sets the properties for the heading (which uses the appname class), including centering, background and text colors, the font family and size, and the padding.

.fieldname

Sets the width of elements using the fieldname class by first floating them.

.main

Applies an indent to elements that use it.

.info

Used for displaying important information: sets a background and foreground text color, applies a border and padding, and indents elements that employ it.

.menu li, and .button

Ensure that all <li> elements and the button class display inline, have padding applied, and have a border, a background and foreground text color, a right margin, rounded borders, and a shadow (resulting in a button effect).

.subhead

Emphasizes sections of text.

.taken, .available, .error, and .whisper

Set the ...

Get Learning PHP, MySQL, JavaScript, and CSS, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.