我的html經驗

1、AI圖標可以導出成svg格式，頁面可以放大縮小不失真。

2、css善用容器{ display: flex; align-items: center; } 可以讓容器內的填充物水平居中排列。

3、

[class^="q4-icon_"], [class*=" q4-icon_"] {
    font-family: 'q4-icons' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

 

4、css 去除移動端手指按下瞬間的類hover色塊

在指定的a或者button  設置此CSS

-webkit-tap-highlight-color:transparent;

 

5、隱藏select的三角號

<style>
select{
position:relative; z-index:1;
appearance:none;
-moz-appearance:none; /* Firefox */
-webkit-appearance:none; /* Safari 和 Chrome */
}
.dispear{
width: 30px;
height: 20px;
background: #FFF;
position: relative;
z-index: 4;
left: 35px;
top: -20px;
}
</style>

<select>
<option>百度</option>
<option>ffff</option>
<option>ffff</option>
<option>ffff</option>
<option>ffff</option>
<option>ffff</option>
<option>ffff</option>
<option>ffff</option>
</select>
<div class="dispear"></div>