CSS是网页设计中最重要的语言之一,它可以控制网页的样式和布局。在这篇文章中,我们将介绍如何使用CSS将两个input横向排列。<style> .input-contain
CSS是网页设计中最重要的语言之一,它可以控制网页的样式和布局。在这篇文章中,我们将介绍如何使用CSS将两个input横向排列。
<style> .input-container { display: flex; flex-direction: row; } .input-container input { margin-right: 10px; } </style> <div class="input-container"> <input type="text" placeholder="请输入用户名"> <input type="password" placeholder="请输入密码"> </div>
在上面的代码中,我们使用了flex布局来让两个input横向排列。我们给父元素(input-container)设置了display: flex和flex-direction: row,这表示子元素将会以行的方向排列。我们还给每个input设置了margin-right: 10px,这样它们之间就会有一个10像素的间隔。
最后,我们将两个input放进一个div容器中,这样它们就会被放在同一行了。
总结一下,如果你想让两个input横向排列,你可以使用CSS的flex布局,同时给子元素设置间隔。
粉丝
0
关注
0
收藏
0