胡汉九 发表于 2021-12-30 11:58:02

前端网页表格修饰登录界面

本帖最后由 胡汉九 于 2021-12-30 13:27 编辑


前端网页表格修饰登录界面
                                                                                                   代码来源:风火轮技术团队
1.网页界面的模板:



2.实现的思路:

(1)首先我们需要明白我们需要实现的界面是什么样的界面表格
(2)我们在设计好表格时还需要考虑到我们在表格里面需要存放什么样的数据
(3)也就是说我们需要明白我们的项目的需求
(4)根据需求我们可以设计好表格里面了的登录界面如何实现

3.完整的代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>       <!--网址,表格提交到的位置-->
<form action="https://u.unipus.cn/index.html/" method="post">
    <table width="600px" border="1px" cellspacing="0" >
      <tbody>
      <tr height="40px" align="center">
            <td rowspan="4">总体信息</td>
            <td colspan="2">个人信息登录表单</td>
      </tr>

      <tr height="40px" >
            <td align="right">用户名:</td>
            <td>
                <input type="text" name="账号"><!--type需要有name属性-->
            </td>
      </tr>
      <tr height="40px" >

            <td align="right">密码:</td>
            <td><input type="password" name="密码"></td>
      </tr>
      <tr height="40px">
            <td colspan="2" align="center" >
                <input type="submit" value="提交">
                <input type="reset" value="重置">
            </td>
      </tr>
      </tbody>

    </table>
</form>

</body>
</html>







胡汉九 发表于 2021-12-30 13:35:53

视频链接:https://www.bilibili.com/video/BV1Qa41167ea/
详情请关注:风火轮技术团队微信公众号
页: [1]
查看完整版本: 前端网页表格修饰登录界面