css input在一行显示

问天 · 发表于 2024-3-20 09:02:21

要使得多个input元素在一行显示，可以使用CSS的display: inline或者display: inline-block属性。以下是一个简单的例子：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Input in One Line</title>
<style>
  .inline-inputs input {
display: inline-block;
margin-right: 10px; /* 可选，为了在input之间添加间隔 */
  }
</style>
</head>
<body>
<div class="inline-inputs">
  <input type="text" placeholder="Input 1">
  <input type="text" placeholder="Input 2">
  <input type="text" placeholder="Input 3">
</div>
</body>
</html>

在这个例子中，所有的input元素会在一行内显示，并且它们之间会有一些间隔。如果不需要间隔，可以去掉margin-right属性。

		自动登录	找回密码
密码			立即注册