zoukankan      html  css  js  c++  java
  • 页面input控件对齐

    <!--用table布局、 label的inline-block 对齐input-->
    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8" />
        <title>Title</title>
        <style>
            label{
                /*设置了inline-block属性的元素既拥有了block元素可以设置width和height的特性,又保持了inline元素不换行的特性。*/
                display: inline-block;
                min- 100px;/*或者  100px;*/
            }
        </style>
    </head>
    <body>
    <div class="web_login">
        <ul>
            <ul>
                <!--accept-charset 属性规定服务器处理表单数据所接受的字符集.此属性的默认值是
                "unknown",表示表单的字符集与包含表单的文档的字符集相同-->
                <form name="form2" id="regUser" accept-charset="utf-8"  action="/security/addregister" method="post">
                    <!--用label对齐-->
                    <label for="input1">登录名:</label>
                    <input type="text" id="input1" name="name1"></input>
                    <br />
                    <label for="input2">密码:</label>
                    <input type="text" id="input2" name="name2"></input>
    
                    <!--用table对齐-->
                    <table >
                        <tr>
                            <td>用户名:</td>
                            <td><input type="text" name="username" maxlength="16"/></td>
                        </tr>
                        <tr>
                            <td>密码:</td>
                            <td><input type="password" name="password1" maxlength="16" /></td>
                        </tr>
                        <tr>
                            <td>确认密码:</td>
                            <td><input type="password" name="password2" maxlength="16" /></td>
                        </tr>
                    </table>
    
                    <div class="inputArea">
                        <a th:href="@{/security/readdoc}" target="_blank">阅读注册协议</a>
                        <input type="submit" value="同意协议并注册"/>
                    </div>
                </form>
            </ul>
        </ul>
    </div>
    </body>
    </html>
  • 相关阅读:
    gcc 不同平台不同宏写法 Function Multiversioning
    linux win10 挂载 C盘 系统盘 ntfs 问题 休眠 快速启动关闭了
    archlinux wine
    ssm批量操作易错点
    行政区划代码
    ssm获取session
    layui 批量删除点击不起作用
    layui分页失效问题
    java 获取服务器配置信息【使用sigar、sql语句、ServerInfo】
    ssm中html跳转之后乱码
  • 原文地址:https://www.cnblogs.com/wfy680/p/15046347.html
Copyright © 2011-2022 走看看