input屬性placeholder在iOS中顯示不完整的解決方法

在ios中，input會出現placeholder展示不全的問題，這個bug主要的問題是font-size的原因

 

 

原因是，如果只設置placeholder的font-size，input不設置，則input撐不開輸入框，造成placeholder被遮擋
解決辦法： input和placeholder需要同時設置fontSize,並且input的font-size比placeholder大

在這里一定要先設置input，再設置placeholder，不然會被覆蓋

注意注意：input樣式一定要寫在前面

input{
    width: 8.5rem;
    height: 1.25rem;
    font-size: .6rem;
}
::-webkit-input-placeholder{
     font-size: .5rem;
     line-height: 1.2rem;
     text-align: center;
 }
 

 

參考：https://blog.csdn.net/luckyzhoufangbing/article/details/88953963
https://blog.csdn.net/wmeng13/article/details/84067107