CSS3 Secrets: Chapter II

1. A style consists of two elements: the browser formats the page elements (selectors, selector) and the actual formatting instructions (declaration block, declaration block).

2. The simple style also contains the following elements:

(1) Selector (selector): The selector tells the browser which element on the Web page is displayed in what style.

(2) Declaration block (Declaration block): the code behind the selector contains all formatting options to apply to the selector. The declaration block is surrounded by curly braces ({}).

(3) Declaration (Declaration): Add one or more declarations, or format directives, between the left and right braces of a declaration block. Each declaration has two parts: a property and a value, and ends with a semicolon.

(4) Property: CSS provides a number of formatting options called properties. You must add a colon after the property name to separate it from the value.

(5) Value: To assign a value to a creative talent through CSS properties.

Don't forget to append a semicolon (;) to each property: value pair.

3. (1) The internal style sheet is placed between the start and close html<style> tags in

(2) The external style sheet contains a text file of the CSS rules required for all pages. The most common way to link external style sheets is to use HTML <link> tags.

HTML5 how to link an external style sheet:

<link rel= "stylesheet" href= "Css/style.css" >

HTML4.01 is similar, just one more type attribute:

<link rel= "stylesheet" type= "Text/css" href= "Css/style.css" >

The final is XHTML, similar to HTML4.01 just ending with a closed slash:

<link rel= "stylesheet" type= "Text/css" href= "Css/style.css"/>

All document types have two properties:

rel= "stylesheet" indicates the type of link.

href points to the location of the external CSS file in your Web site.

The CSS itself has a way to add an external style sheet: @import directive. Add this command to an HTML <style> tag. Such as:

<style>

@import URL (css/style.css);

</style>

Multiple link statements can be used to reference more than one external linked style sheet.

If you want to add a specific style to a Web page, add the style after the link statement, and be sure to follow the link statement. Otherwise it will be overwritten.

Using the <link> tag to link an external style sheet is more common, @import slows down the download speed of the style sheet.

CSS3 Secrets: Chapter II