1.-webkit-tap-highlight-color
-webkit-tap-highlight-color:rgba(0,0,0,0);//透明度設定為0,去掉點選鏈結和文字框物件時預設的灰色半透明復蓋層(ios)或者虛框(android)
-webkit-tap-highlight-color:rgba(255,0,0,0.5); //利用此屬性,設定touch時鏈結區域高亮為50%的透明紅,只在ios上起作用。android上只要使用了此屬性就表現為邊框。在body上加此屬性,這樣就保證body的點選區域效果一致了
2.outline:none
(1)在pc端為a標籤定義這個樣式的目的是為了取消ie瀏覽器下點選a標籤時出現的虛線。ie7及以下瀏覽器還不識別此屬性,需要在a標籤上新增hidefocus="true"
(2)input,textarea 取消chrome下預設的文字框聚焦樣式
不同type的input使用這個屬性之後表現不一。text、button無樣式,radio、checkbox直接消失
4.-webkit-user-select
-webkit-user-select: none; // 禁止頁面文字選擇 ,此屬性不繼承,一般加在body上規定整個body的文字都不會自動調整
5.-webkit-text-size-adjust
-webkit-text-size-adjust: none; //禁止文字自動調整大小(預設情況下旋轉裝置的時候文字大小會發生變化),此屬性也不繼承,一般加在body上規定整個body的文字都不會自動調整
6.-webkit-touch-callout
-webkit-touch-callout:none; // 禁用長按頁面時的彈出選單(ios下有效) ,img和a標籤都要加
7.-webkit-overflow-scrolling
-webkit-overflow-scrolling:touch;// 區域性滾動(僅ios
5以上支援)
重置預設樣式
最近看到乙個詞叫css reset。什麼叫做css reset呢?我理解為重置css,也就是重置預設樣式。我在html下的預設樣式 中講到,一些標籤元素在html下有乙個預設屬性值,我們在寫css頁面的時候,為了避免在css中重複定義它們,我們需要重置預設樣式 css reset www.taoba...
移動端開發 頁面樣式重置的幾個知識點
一 在手機中,當處於模組一狀態時,使用者觸控到 按鈕 a標籤的邊框顯示出來,這明顯不是我們要想要的體驗。加上 webkit tap highlight color即可去除。webkit tap highlight color rgba 0,0,0,0 transparent 利用此屬性,設定touc...
HTML預設樣式重置
doctype html utf 8 viewport content width device width,initial scale 1.0 x ua compatible content ie edge default style title 表示所有元素 style head 一般開發都會先...