有人能帮我解决这个恶魔问题吗...我读了所有的指南,解决方案是设置输入为16px,但它仍然不工作,它让我疯了。
16px
@media only screen and (max-device-width: 600px) { input { font-size: 16px; } }
我不明白...为什么不管用?
ghhkc1vu1#
您可以将此代码添加到html中<head>标记的html代码中:<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">maximum-scale=1将阻止输入的缩放,并且页面缩放将保持其默认缩放级别,但是如果用户想要,用户仍然可以裁剪屏幕以调整大小。
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
maximum-scale=1
uhry853o2#
我通常只指定几种最流行的输入类型来设置它们的字体大小,而不是加载,我不建议只针对input,因为这也会影响复选框之类的东西...
input
input[type="tel"], input[type="text"], input[type="date"], input[type="email"], input[type="number"], input[type="assword"], textarea { font-size: 16px; }
de90aj5v3#
溶液#1
@media screen and (-webkit-min-device-pixel-ratio: 2) { select, select:focus, textarea, textarea:focus, input, input:focus { font-size: 16px; } }
此媒体查询将仅针对iOS设备以下是仅针对目标设备实现媒体查询的文章。https://css-tricks.com/snippets/css/media-queries-for-standard-devices/溶液#2如果你的网站是为移动设备设计的,你可以决定不允许缩放。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
n1bvdmb64#
你还需要一个属性:
@media only screen and (max-device-width: 600px) { input { -webkit-appearance: none; font-size: 16px; } }
jyztefdp5#
我认为您需要针对文本区域,而不仅仅是输入
textarea { font-size: 16px; }
。此外,根据输入,我将使用以下任何一种:
input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], select:focus, textarea { font-size: 16px; }
iklwldmw6#
如果您想为iPhone应用某些样式,您应该检测触摸屏:
@media (hover: none) and (pointer: coarse)
因此,要在触摸屏上为输入设置font-size,您应该执行以下操作:
font-size
@media (hover: none) and (pointer: coarse) { input[type=text] { font-size: 16px; } }
6条答案
按热度按时间ghhkc1vu1#
您可以将此代码添加到html中
<head>
标记的html代码中:<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
maximum-scale=1
将阻止输入的缩放,并且页面缩放将保持其默认缩放级别,但是如果用户想要,用户仍然可以裁剪屏幕以调整大小。uhry853o2#
我通常只指定几种最流行的输入类型来设置它们的字体大小,而不是加载,我不建议只针对
input
,因为这也会影响复选框之类的东西...de90aj5v3#
溶液#1
此媒体查询将仅针对iOS设备
以下是仅针对目标设备实现媒体查询的文章。
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
溶液#2
如果你的网站是为移动设备设计的,你可以决定不允许缩放。
n1bvdmb64#
你还需要一个属性:
jyztefdp5#
我认为您需要针对文本区域,而不仅仅是输入
。此外,根据输入,我将使用以下任何一种:
iklwldmw6#
如果您想为iPhone应用某些样式,您应该检测触摸屏:
因此,要在触摸屏上为输入设置
font-size
,您应该执行以下操作: