ID用于標識頁面上的特定元素（比如站點導航），而且必須是唯一的。 ID也可以用來標識持久的結構性元素，例如主導航或內容區域。ID還可以用來標識一次性元素，例如某個鏈接或表單元素。一個ID只能應用于頁面上的一個元素。

class同一個類名可以應用于頁面上任意多個元素，因此類的功能強大的多。類非常適合表示內容的類型或其他相似的條目。

在實際開發中，要根據實際使用情況來決定是使用哪種樣式。對于單一元素的在單一界面的展示樣式可以推薦是用id來定位。多余多個界面公用，或者同一界面多個元素風格一致，樣式統一使用class類要方便的多。

下面就是最簡單的一個小例子：

展示效果：

行內樣式優先級最高，接著是內聯樣式，最后是外聯樣式。

不包括

?一：css基本選擇器有哪些

1.css屬性選擇器

2.css標簽選擇器

3.cssID選擇器

4.css的通配符

二：css有哪些高級選擇器

1.css標簽選擇器

css標簽選擇器其實就是頁面上的所有類型的標簽，我們對經常描述稱為共性，對無法描述的稱為個性。我們在頁面上看到input，div和ul都有可能是選擇器，無論這個標簽藏得多深，都可能被選擇上，并且選擇的是所有標簽，并不是單單指一個。

2.cssID選擇器

css中我們使用#來對名字進行自定義，#是指對一個特殊的標簽來使用，并且只能用一次，在任何html標簽中，都可以有id屬性，但是前提要按照字母開頭，更不能用字母去開頭，或者和標簽同名。還有一些高手建議在css層面上盡量不要使用id。

3.css類選擇器

css中類選擇器，我們使用.來表示，我們使用類來表示，其實就是比較靈活。class和id是十分相似的，并且同一個標簽可以使用很多個類選擇器，也可以多種標簽使用。

4.css的通配符，可以替換任何標簽，目前有些瀏覽器是不支持使用。

瀏覽器解析html文檔是自上而下的，如果將CSS放在底部，頁面可以逐步呈現，但在CSS下載并解析完畢后，已經呈現的文字和圖片就要需要根據新的樣式重繪，這是一種不好的用戶體驗。

本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

css文件應該放在HTML頂部的head中。

why?

link標簽里面的href(HyperText reference)屬性表示超文本引用，當CSS使用href引用，瀏覽器會識別該文檔為CSS，并行下載，不會停止對當前文檔的加載，在加載html生成DOM tree的時候，就可以同時對DOM tree進行渲染，這樣可以防止閃跳，白屏或者布局混亂。

最理想的情況，我們希望瀏覽器逐漸的渲染下載好的CSS，將頁面逐漸的展現給用戶。但是瀏覽器為了避免樣式變化時重新渲染繪制頁面元素，會阻塞內容逐步呈現，瀏覽器等待所有樣式加載完成之后才一次性渲染呈現頁面。

CSS文件如果放置底部，瀏覽器阻止內容逐步呈現，瀏覽器在等待最后一個css文件下載完成的過程中，就出現了“白屏”(新打開連接時為白屏，爾后先出現文字，圖片，樣式最后出現)。這點非常嚴重，因為在網速非常慢的情況下，css下載時間比較長，這樣就給用戶帶來“白屏”的時間自然也就很長了，用戶體驗非常差。

CSS文件放在頂部一方面是因為放置順序決定了下載的優先級，更關鍵的是瀏覽器的渲染機制。

css在加載過程中不會影響到DOM樹的生成，但是會影響到Render樹的生成，進而影響到layout，所以一般來說，style的link標簽需要盡量放在head里面，因為在解析DOM樹的時候是自上而下的，而css樣式又是通過異步加載的，這樣的話，解析DOM樹下的body節點和加載css樣式能盡可能的并行，加快Render樹的生成的速度。

將CSS放在底部，頁面可以逐步呈現，但在CSS下載并解析完畢后，已經呈現的文字和圖片就要需要根據新的樣式重繪，這是一種不好的用戶體驗。