前端 - Safari:select下拉方塊的字型不能居中。
为情所困
为情所困 2017-05-16 13:24:50
0
2
1271

在chrome上使用text-align沒有用,後來試了下text-align-last:center有作用,但是在Safari上是無效的;
## Google後也沒發現什麼有價值的,有哪位遇過嗎?

为情所困
为情所困

全部回覆(2)
漂亮男人

有一個hack的辦法

在select的位置寫一個span,用js去綁定span裡的值和select的值,讓span元素居中,隱藏掉select。

大約是這樣的:

js的內容就自己寫吧

.pesu-select {  
    text-align: center;    
    border:solid 1px #000;  
}  
.pesu-select select {  
    position: absolute;  
    left: 0px;  
    top: 0px;  
    width: 100%;  
    height: 42px;  
    opacity: 0;  
}  
   
<p class="pesu-select">  
    <span>aaa</span>  
    <select>  
        <option value="1">aaa</option>  
        <option value="2">bbb</option>  
        <option value="3">ccc</option>  
    </select>  
</p> 
習慣沉默

其他途徑解決問題:select外麵包一層p,select的寬度不設定(由內容撐開),設定容器的寬度與text-align:center;

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板