iPhone浏览器重新调整表单元素占位符字体大小

Posted 2023-03-06

【中文标题】iPhone浏览器重新调整表单元素占位符字体大小

【英文标题】：iPhone browser re-sizes form element placeholder font-size

【发布时间】：2011-11-22 05:54:04

【问题描述】：

我遇到的问题不是我网页上的文字，没关系“它是否在<p> 标签内，或者确保它在<div> 和-webkit-text-size-adjust: none; 或100%; 中不能解决这个问题。

我在谈论的是显示在文本字段中的 placeholder 值正在被 iPhone 浏览器重新调整大小，这反过来又重新调整了每个文本字段的高度，进而抛出了表单域与其背景的对齐。

Link to Problem (Visit with iphone to see the problem, obviously)

【参考方案1】：

问题不在于字体大小，而在于输入框本身。 iPhone 浏览器正在向它们添加填充，所以这是修复：

`inputpadding:1px 0;`

谢谢！

【参考方案2】：

查看您的来源，您可能正在尝试使用

<input type="blah" placeholder="text">

但您不会影响这些标签中的占位符样式。相反，你应该使用类似的东西

input::-webkit-input-placeholder  ...whatever here...  

影响样式。

查看this link on styling placeholders in various browsers。

【讨论】：

这并没有真正解决我的问题，但我感谢您传递此信息。虽然，我注意到在 <input> 中使用 placeholder="..." 可以在除 IE 之外的所有浏览器上使用。