整理--清除標籤預設樣式
阿新 • • 發佈:2019-01-27
a標籤:
a, a:hover, a:visited, a:link, a:active {
color:#000;
text-decoration:none;
outline: none;
// a標籤的四種狀態都和本身顏色保持一致
}
button按鈕:
.button{
border:0;
background-color:none
outline:none;
-webkit-appearance: none;//用於IOS下移除原生樣式
}
select 標籤:
select {
border: none;
appearance :none;
-moz-appearance:none;
-webkit-appearance:none;
/*在選擇框的最右側中間顯示小箭頭圖片*/
background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;
padding-right: 14px;
}
input
input{
border: none;
appearance:none;
-moz-appearance:none;
outline :none;//input標籤聚焦不出現預設邊框:
-webkit-appearance: none;//用於IOS下移除原生樣式
}
//or:
input:focus{ outline:none; }//input標籤聚焦不出現預設邊框:
input標籤placeholder樣式重設:
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:#3c8bee ;; opacity:1; font-size: 0.25rem;text-align: center; }
::-moz-placeholder { /* Mozilla Firefox 19+ */ color:#3c8bee ;; opacity:1; font-size: 0.25rem;text-align: center; }
input:-ms-input-placeholder{ color:#3c8bee ;; opacity:1; font-size: 0.25rem;text-align: center; }
input::-webkit-input-placeholder{ color:#3c8bee ;; opacity:1; font-size: 0.25rem;text-align: center; }