span标签和input标签怎么设置在同一行

最新推荐文章于 2024-05-22 21:53:11 发布

xinan~

最新推荐文章于 2024-05-22 21:53:11 发布

阅读量2.8w

点赞数 6

文章标签： span和input框怎么设置为在同一行输入框前面的字体居中

本文链接：https://blog.csdn.net/pavel101/article/details/88284791

版权

昨天正好碰到了这个问题，就此记录一下：

分别给span标签和input标签设置float:left，左浮；并且将span和input的height设置成一样，span的line-height也设置和height一样高，有个地方需要注意，input的width不能设置成100%，不然float：left不起作用了。

<span style="float: left; height: 34px; width: 50px; line-height: 34px;">标签：</span>
<input name="tag" style="width:calc(100% - 50px);resize:none; height: 34px; float: left"
       placeholder="统一标签(标签必须以 C_ 开头，不可包含空格和逗号)" maxlength="15">
<hr/>

最后效果如下：