首頁(yè) 猿問(wèn) 安卓手機(jī)和蘋(píng)果手機(jī)...

安卓手機(jī)和蘋(píng)果手機(jī) placeholder 不垂直居中的問(wèn)題

JavaScript

繁華開(kāi)滿天機(jī) 2019-03-12 17:13:04

在現(xiàn)等待，該如何解決 height: 54px; line-height: 54px;蘋(píng)果手機(jī)placeholder正常垂直居中，安卓手機(jī)偏上蘋(píng)果手機(jī)光標(biāo)不正常

查看完整描述

2 回答

人到中年有點(diǎn)甜

TA貢獻(xiàn)1895條經(jīng)驗(yàn) 獲得超7個(gè)贊

這個(gè)問(wèn)題，可以通過(guò)改變布局思路來(lái)解決，div模擬40像素高的輸入框，子元素input高度與字體大小相同，背景透明無(wú)邊框，此時(shí)輸入文字和placeholder提示文字都可以顯示在中間的位置，并且安卓手機(jī)、蘋(píng)果手機(jī)和電腦以及正常的pc瀏覽器都不會(huì)出現(xiàn)上偏下移的問(wèn)題。
優(yōu)化問(wèn)題：只有在點(diǎn)擊到input時(shí)才會(huì)有光標(biāo)，才能輸入，此時(shí)可以為div做點(diǎn)擊事件為input獲取光標(biāo)，即可完美模擬input輸入框。

反對(duì) 回復(fù) 2019-04-04