1. 程式人生 > >css-去除預設樣式

css-去除預設樣式

1.去除select預設的下三角

select {-webkit-appearance: none;border-radius: 0;}

2.checkbox

去除預設樣式後,選中狀態勾選樣式無法出現,需要設定

input {-webkit-appearance: none;border-radius: 0;}
input[type=checkbox]:checked:after{}

3.禁止使用者選中文字

-webkit-user-select:none;

4.劃線

<div class="kind">
<span class="price">¥120元</span>
</div>
 
.kind .price {position: relative;display: inline-block;margin:0 10px;}
.kind .price::before {content: '';width:100%;position: absolute;top:50%;left:0;border-bottom: 2px solid #333;}