html標籤在各個瀏覽器中會有不同的預設屬性,reset.css和normalize.css是我使用最頻繁的基礎樣式庫,他們都是為了解決相容性和統一視覺效果,但是其中的風格略有不同。
reset從單詞的意思就很好理解,重置、清零,它會把所有的標籤的margin、padding、border等等屬性重置掉。
normalize與reset不同之處在於,它不會重置標籤的預設屬性,而是保證標籤在各瀏覽器相容性的情況下保留下來了預設屬性。
同樣一段html,來看看reset與normalize展示出來的效果:
>
標題h1
>
>
pp>
type
="text"
>
>
>
>
1td>
>
2td>
>
3td>
tr>
>
>
4td>
>
5td>
>
6td>
tr>
table
>
>
>
1li>
>
2li>
>
3li>
ul>
使用reset的效果圖:
使用normalize的效果圖:
網上對比的文章很多,都列出了他們的優劣勢,其實更應該從專案本身考慮,適合哪個就用哪個,有句話很對,存在即合理。
CSS基礎樣式庫
推薦的base.css css reset body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td table fieldest,img address,capt...
CSS基礎樣式
css指層疊樣式表,它作用是控制頁面內容的外觀。這樣就可以將網頁的內容和表現形式分離。層疊的意思是 如果選擇器的權重相同,則後面元素的樣式會覆蓋前面樣式。css樣式表由選擇器和宣告兩個部分組成,其中選擇器是通過名字來標識元素的,宣告用於定義元素的樣式。a 樣式表比較常見的有三種引入方式 1.行內樣式...
CSS基礎樣式
顏色 單位 color 設定文字顏色 text align 設定文字對齊方式 letter spacing 字間距 line height 行高 text indent 首行縮排 text decoration 文字裝飾 text transform 大小寫轉換 text shadow 建立文字陰影...