✨
HTML 網頁設計
  • HTML 簡介
  • 1.網站三兄弟
    • 環境設定
    • HTML 基本結構
      • 文件架構
      • 元素
      • 文章-使用的元素
      • 超連結
      • Form表單
      • 嵌入第三方服務
    • Css 基本使用
      • 使用方式 Background
        • before、after
      • Box-sizing 介紹
      • Reset Css
      • CSS - 排版
        • CSS - 定位器
        • 導覽列篇
        • 置中篇 - 範例
        • 三欄式 - 範例
        • 兩欄式
      • css命名規則
    • JS 基本使用
      • 基本語法
      • 參數/arguments
      • param() 方法
      • 定時器（timer）
  • 2.css 進階使用
    • Display
    • Position
      • z-index and stacking context
      • Table
    • CSS選擇器
  • 3.其他JS工具
    • jQuery 簡介
      • $.cookie()
      • .animate
      • scrollTop
      • 使用效果
    • BootStrap
    • NODE.JS
      • 安裝 Node.js
        • SVG - 可縮放向量圖形
      • webpack
    • React
      • React Native
  • 4.曲線圖
    • Chart 前端操作
      • Datasets Style
      • Line 設定
  • 4.DataTable
    • Bootstrap Table
  • 99.其他內容
    • Webpack
    • IIS - 網際網路資訊服務
      • 環境設定
      • WEB IIS架站
Powered by GitBook
On this page
  • 為什麼要用CSS -Reset
  • CSS Reset
  • MeyerWeb-[CSS Reset]
  • CSS Normalize

Was this helpful?

  1. 1.網站三兄弟
  2. Css 基本使用

Reset Css

https://meyerweb.com/eric/tools/css/reset/

PreviousBox-sizing 介紹NextCSS - 排版

Last updated 4 years ago

Was this helpful?

為什麼要用CSS -Reset

在 W3C 制訂 HTML 與 CSS 規格時，並沒有強制規定各家瀏覽器應該怎樣實作每一個 HTML tag 的 CSS 預設樣式，只有提供資訊參考的範例[1]，加上IE 獨霸的時期，那時候還沒有其他瀏覽器， CSS Reset 的需求主要落在 IE 各版本之間的調整，後來 Firefox、safari、Chrome 陸續出現，網頁設計師必須要針對每個瀏覽器去做調整，因此 CSS Reset 的需求漸漸增加。

CSS Reset

有幾套常見的 CSS Reset

  • ，此為 Eric Meyer 的版本

  • ，HTML5 Doctor 網站修改自 Eric A. Meyer 的版本。

  • ，由 Yahoo UI Library v3 所提供的 CSS Reset 版本。

MeyerWeb-[CSS Reset]

是Eric整理出來一個解決方案[CSS Reset]，強制把所有地方強制歸零，可以看到最一開始一大串的html標籤都設為0。缺點則是必須要重做設定，比較沒有彈性。

參考網址：

CSS Normalize

因為 reset.css 重置了各個瀏覽器的樣式設定，使得有些有用、常用標籤的默認樣式必須要重新設定，因為這個問題，有人開發出了 normalize.css [4]

在 Normalize.css 的官方頁面上點出了他們的目標：[5]

  • 保留有用的瀏覽器默認設置，而不是將其刪除。

  • 為廣泛的 HTML 元素提供一般化的樣式。

  • 修正瀏覽器的 Bug 與不一致。

  • 透過微妙的改善提高可用性。

  • 有詳細的文檔來解釋代碼。(每個樣式都有註解是處理什麼問題。)

程式參考：

Reset CSS
HTML5 Reset Stylesheet
CSS Reset - YUI Library
https://meyerweb.com/eric/tools/css/reset/
https://necolas.github.io/normalize.css/