因爲每一個瀏覽器都有本身的UA樣式,而且這些樣式還不太統一,因此須要作樣式reset,常見的reset有如下:css
/* IE瀏覽器對輸入控件有本身的font-family,須要統一 */ input, textarea, button{ font-family: inherit; } /* Chrome瀏覽器會在輸入控制彙集的時候添加一個藍色的outline*/ input:focus, textarea:focus, select:focus{ outline: none; } /* 去掉textarea的可拉大小功能*/ textarea{ resize: none; } /* IOS Safari在橫屏的時候會放大字體,第二個屬性讓滑動更流暢 */ html{ -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling : touch; } /* 統一標籤的margin值和p標籤的line-height*/ body, p, h1, h2, ul, ol, figure, li{ padding: 0; margin: 0; } h1, h2, p{ line-height: 150%; } /* 去掉select的默認樣式 */ select{ -webkit-appearance: none; } /* 若是有輸入內容IE會給輸入框右邊加一個大大的X */ input::-ms-clear{ display: none; width: 0; height: 0; } /* 去掉number輸入框右邊點擊上下的小三角 */ input::-webkit-inner-spin-button{ -webkit-appearance: none; } input::-webki-outer-spin-button{ -webki-appearance: none; }