使用fieldset标签创建登录页面

最新推荐文章于 2023-06-28 18:12:43 发布

原创最新推荐文章于 2023-06-28 18:12:43 发布 · 907 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#input #border #class #div #table #html

页面效果专栏收录该内容

8 篇文章

订阅专栏

本文详细介绍了系统登录页面的设计与实现过程，包括HTML、CSS样式应用，表单元素使用及用户交互体验优化。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>系统登录</title>
<style type="text/css">
.inputCss
{
    width :150px; 
    height:20px;
    border:solid auto blue;
}
</style>
</head>
<body style=" margin :15% auto; padding :0 auto;">
    <div align="center">
        <fieldset style="width:500PX;">
            <legend>系统登录</legend>
            <div align="center">
                <table width="50%" border="0" align="center">
                    <tr>
                        <td width="25%" align="left" style="height: 24px">
                            用户名</td>
                        <td align="left" style="height: 24px">
                            <input type="text" id="uName" name="uName" class="inputCss"/></td>
                    </tr>
                    <tr>
                        <td width="25%" align="left" style="height: 24px">
                            密码</td>
                        <td align="left" style="height: 24px">
                            <input type="password" id="uPwd" name="uPwd" class="inputCss"/></td>
                    </tr>
                    <tr>
                        <td align="center" colspan="2">
                            <input type="submit" id="sub" name="sub" value="登录"/></td>
                    </tr>
                </table>
            </div>
        </fieldset>
    </div>
</body>
</html>