两个input在同一行连着不留缝隙

转载于 2017-08-28 14:53:00 发布 · 1.6k 阅读

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/jin7754/p/7443851.html

本文介绍如何使用CSS技巧实现多个输入框在同一行内显示而不换行的方法，包括调整父元素字体大小、使用定位及浮动布局等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法1：让两个input 连在一起写 不换行

<div class="inputDiv">
  <input type="text" placeholder="请输入文字"><input type="text" placeholder="center">
</div>

方法2：给这两个input的父元素添加 font-size:0

.inputDiv {
  font-size: 0;
}

<div class="inputDiv">
  <input type="text" placeholder="请输入文字">
  <input type="text" placeholder="center">
</div>
方法3：用定位 调节left top
方法4：用浮动

转载于:https://www.cnblogs.com/jin7754/p/7443851.html