Question

根据我的理解，由width标记呈现的input元素type text属性为size由其大小决定。（另一个因素是该DOM节点上活动字体的尺寸）。

如果不更改字体的任何内容，是否可以仅使用CSS调整input代码的{{1}}属性＆＃34;响应＆＃34;？

我希望实现的效果是，对于某些屏幕宽度，输入大小为20，而对于其他人，我希望它是，例如，40 。

我知道JS解决方案。没有答案会比JS解决方案更好。谢谢。

编辑：一些更多的信息，根据这些信息，我的问题可能有点过于具体，但我想我还是会问 - 我之所以要求它的原因是因为我＆＃39; m使用带反馈图标的bootstrap。当我根据特定的屏幕尺寸将宽度设置为200％时，反馈图标保持在当前位置，我可以改变它，但我对该解决方案不满意。有谁知道为什么反馈图标没有适当移动？

Answer 1

感觉很乱，但您可以根据vw水平单位设置字体大小。但是，这只会对monospace webfonts（你知道字母的宽高比如何）的宽度进行精确约束。

＆＃13;

      body {
      font-size: 14px; /*fallback for old browsers */
      font-size: calc(1.4*100vw/80);
      /* 1.4 is a fudge factor by inspection. */
      }

＆＃13;

＆＃13;

Answer 2

使用％和 em 进行衡量将使您的元素响应

e.g. input { width: 100%; padding: .5em 1em; }

响应输入文本大小

2 个答案: