鍍金池/ 問答/網(wǎng)絡安全  HTML/ 同一個手機頁面在安卓和蘋果手機上打開位置為何不同？

同一個手機頁面在安卓和蘋果手機上打開位置為何不同？

如圖，同一個頁面，加的居中屬性。
蘋果手機：圖片描述

安卓手機：圖片描述

如何讓頁面的內(nèi)容在兩種手機上都為居中顯示？
還有，代碼中就是寫的居中，蘋果手機頁面為什么會發(fā)生偏移？

這是在蘋果手機上按住input出現(xiàn)的陰影：圖片描述

很明顯的看到大了一塊，為什么div和input設置的同樣的寬度在手機上展示時會變大？
百思不得姐，就解惑，蟹蟹！

css代碼：

#hengpi {
    width: 120px;
    height: 36px;
    border: none;
    background: rgba(0, 0, 0, 0);
    outline: none;
    color: #fff;
    font-size: 22px;
    text-align: center;
    font-family: myfont;
}
.hengpi_img {
    text-align: center;
    background: url(images/hengpi.png) no-repeat;
    background-size: 100%;
    width: 120px;
    margin: 0 auto;
}

html代碼：

<div class="hengpi_img">
    <input type="text" maxlength="4" id="hengpi" value="哈哈哈哈" onfocus="this.blur();" />
</div>
回答
編輯回答
別逞強

css貼出來看一下 ios有他特有的默認屬性的

2018年1月30日 14:51
編輯回答
青瓷

你外面的盒子影響了他圖片描述

hengpi {

        width: 120px;
        height: 36px;
        display: block;
        border: none;
        background: #ccc;
        outline: none;
        color: #fff;
        font-size: 22px;
        text-align: center;
        
        margin: 0 auto;
    }
    <input type="text" maxlength="4" id="hengpi" value="哈哈哈哈" />
    這樣就沒問題
2017年2月9日 11:40
編輯回答
朕略傻

在iphone中 可點擊的元素在點擊時會出現(xiàn)灰色的底色使用 -webkit-tap-highlight-color:rgba(0,0,0,0) 可取消。

2017年10月30日 17:28