如何設置或者改變placeholder的默認樣式并且改變蘋果手機input光標與input標簽等高的問題

input標簽的placeholder有默認的樣式,但是也是可以修改的,可以修改各種樣式,顏色,字體大小,行高等等,修改樣式如下:

input::-webkit-input-placeholder { /* WebKit browsers */

font-size: 16px;

}

input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

font-size: 16px;

}

input::-moz-placeholder { /* Mozilla Firefox 19+ */

font-size: 16px;

}

input:-ms-input-placeholder { /* Internet Explorer 10+ */

font-size: 16px;

}

蘋果手機跟安卓手機不太一樣,蘋果手機的光標大小,是跟行高有關的,如果,input的height為40px,其line-height也是40px,則,蘋果手機的輸入框光標會從input標簽的上邊框到下邊框,安卓手機沒有這種狀況,這不是我們想要的,因此,我們常用的改變蘋果手機的光標高低的方式,是通過上下padding與line-height結合使用,比如:input的height為40px;想讓光標高低為20px。則可以padding:10px 0;line-height:20px;則可以解決這個問題的。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,815評論 1 92
  • 不會用代碼框,所以看著有些亂套,,,,html部分 <!DOCTYPE html> 迅雷看看 ...
    這就是個帥氣的名字閱讀 1,564評論 0 0
  • 早上起來刷牙,回想起這兩天的過程,覺得像小時候家里辦喜酒一樣,起初的滿懷期待,到來時心生歡喜,結束后的失之泰然,...
    魚羊ll閱讀 485評論 0 0
  • 文/唐露 “千萬記住,藝伎不是妓女,也不是別人的妻子,我們賣藝,但不賣身。我們營造一個神秘的世界,一切美不勝收。藝...
    唐露閱讀 16,889評論 60 239