论坛 › Web开发 › 这个用户名和密码 如何能对齐呢，我加几个空格 都对不齐，不是超了 就是不够

wp231957 发表于 2020-2-11 20:06:14

这个用户名和密码 如何能对齐呢，我加几个空格 都对不齐，不是超了 就是不够

<form method="POST">
         <label>用户名:</label><input type="text" name="username" value=""><br>
             <label>密&nbsp&nbsp&nbsp码:</label><input type="password" name="password" value=""><br><br>
         <input id="logclick" type="submit" value="登录">
         <input id="logout" type="submit" value="退出">
    </form>

人随世俗变 发表于 2020-2-11 20:23:19

<style type="text/css">
                        label{
                                display:inline-block;
                                text-align:right;
                        }
                </style>

人随世俗变 发表于 2020-2-11 20:23:50

人随世俗变 发表于 2020-2-11 20:23


加个css样式就可以

不二如是 发表于 2020-2-11 20:26:39

1、通过 &nbsp 可以对齐：


2、更好的做法通过 CSS 实现

修改代码：

<form method="POST">
      <div class="block">
            <label for="username">用户名：</label>
            <input type="text" name="username">
      </div>
      <div class="block">
            <label for="password">密码：</label>
            <input type="password" name="password">
      </div>

      <div class="block center">
            <input id="logclick" type="submit" value="登录">
            <input id="logout" type="submit" value="退出">
      </div>
    </form>
添加 CSS：

label {
            display: inline-block;
            width: 100px;
            text-align: right;
      }


底下按钮样式没有管～

wp231957 发表于 2020-2-12 13:00:28

不二如是 发表于 2020-2-11 20:26
1、通过 &nbsp 可以对齐：




是我设置的最佳答案吗   好像不是我啊

查看完整版本: 这个用户名和密码 如何能对齐呢，我加几个空格 都对不齐，不是超了 就是不够