Details CSS style sheet use: Link/embed _css/html

In the W3CN of Atzie, he said:

Reference content
In the past, we usually used style sheets in 2 ways:
Page inline: Just write the style sheet directly in the head area of the page code. Something like this:
<style type= "Text/css" > <!--body {background:white; color:black;}--> </style>
External invocation Method: Write the stylesheet in a separate. css file, and then invoke it in the page head, similar to the following code.
<link rel= "stylesheet" rev= "stylesheet" href= "Css/style.css" type= "Text/css" media= "All"/>
In the design that conforms to the Web standard, we use the external modulation usage, the benefit is self-evident, you can change the page style without modifying the page only. css file. If all pages call the same style sheet file, changing a style sheet file can change the style of all files.

It can be seen that the Atzie is highly respected with <link>. In addition to the Atzie, the benefits of using <link> are not only convenient to modify the style sheet, but also to speed up the user's browsing speed. The first time a user opens a page that has a linked style sheet, the style sheet is automatically downloaded to the local cache. When the user opens another page and the page is linked to the same style sheet, it reads the relevant files from the cache, which speeds up browsing.

But I have also encountered this situation: sometimes the network is not smooth, the page opened, the linked style sheet did not load successfully. The consequences of this situation, not only the color of the page text, size and so on style can not be shown, but more troublesome is likely to cause the layout of the entire page messy set!

For example, once I open macromedia.com, the company network is not smooth, perhaps because there are a lot of people in BT Bar ... The result page appears to look completely like no style sheet, the familiar layout is not visible, all content from the top down, like using a mobile phone in the browsing site. Although the content can be seen all, but I have to take some time to familiarize myself with this new layout, browsing time there is a feeling of not smooth.

In doing the first page of Jinshan online (the last version, now can not see it), I have all the styles embedded into the

On the weekends I do Amaoagou's homepage, and I plan to go further: layout-related styles: #head, #left之类都嵌入到页面内部, and other styles in a linked way.

To sum up:

* Method One: The homepage completely adopts the embedding method, the other page all uses the link way. Advantages: This can ensure that the home page in the network condition is still able to correctly display. Disadvantage: When modifying a style, you need to modify the external style sheet and the style sheet embedded in the first two places.
* Method Two: Writes the layout-responsible style separately from the other styles. The home page embeds the layout the style, links the other style, other pages for both sets of styles use the link way. Advantages: When you modify a style, it is less than the first workload. When the network condition is bad, the appearance of the homepage cannot guarantee completely, but the layout is not disorderly at least.
* If the production is not a standard page, such as a small topic of the company's products, the leader asked to make a table to ensure that the project on-line speed. The styles used for each page: links. For only this page will be used, but will use many times the style: embedded