一般在網頁設計時,都會使用 CSS Reset 來清除各種瀏覽器的預設樣式,接著再設定想要的樣式時就會排除掉很多在不同瀏覽器上詭異的情況。
而現在,除了以往常見 Eric Meyer 版本、YUI 版本的 CSS Reset 之外,還有另一種選擇-
Normalize CSS
而現在,除了以往常見 Eric Meyer 版本、YUI 版本的 CSS Reset 之外,還有另一種選擇-
Normalize CSS
Normalize CSS 和 CSS Reset 最大的不同在於,CSS Reset 是清除所有預設的樣式;而 Normalize CSS 則是賦予各種 HTML 元素一個預設的樣式,譬如
<h1>
、<h2>
、<h3>
等標題字型大小、<ul>
的預設該有的 padding 等等。也增加了一些可用性(如在 <button>
元素上游標會變成手指狀,告訴使用者可以按)。有了這些預設的樣式,在寫我們自己的 CSS 時,可以減少許多屬性設定。
另外 Normalize CSS 是針對 HTML5 的 CSS 框架,所以支援 HTML5 中新的標籤,包括 video、canvas 等等。如果要做 HTML5 的網頁的話,會非常方便。Normalize CSS 的專案頁面上提供了一個 Demo 的網頁。可以看看各種元素經過 Normalize CSS 標準化之後的模樣。
Normalize CSS on GitHub:https://github.com/necolas/normalize.css/
CSS 檔案:https://github.com/necolas/normalize.css/blob/master/normalize.css
沒有留言:
張貼留言