web前端学习第一天心得

最新推荐文章于 2024-08-16 22:44:51 发布

还未迟暮

最新推荐文章于 2024-08-16 22:44:51 发布

阅读量581

点赞数

文章标签： html web

本文链接：https://blog.csdn.net/m0_63122857/article/details/121636539

版权

这篇博客展示了作者第一天学习web时的成果，包括创建了一个用户注册页面和一个课程表。注册页面使用了HTML和CSS，包含密码输入、邮箱验证、性别选择和兴趣爱好的文本区域。课程表部分则通过HTML表格呈现了一周的课程安排，详细列出了每天的课程内容。

摘要由CSDN通过智能技术生成

第一天学习web的一点成果分享

这是今天做的注册页面成果，用到一些简单的标签来写

<style>
            body{
		        background-image:url("bg.jpg")
            }
            form{
                width: 700px;
                height: 500px;
                margin: auto;
                background-color: rgba(11, 123, 250, 0.897);
            }

            .a1{
                margin-left: 4px;
            }

            .a2{
                margin-right: 95px;
            }

            .a3{
               margin-right: 120px;
            }

            button{
                margin-left: 20px;
                background: rgb(230, 230, 241);
                color:red;
            }     
    </style>
    </head>
    <body>

        <form action="" >
        <center><h1><img width="50" height="50" src="logo.png" >用户注册</h1></center>

        <center><p>登录密码:<span><input type="password" required placeholder="请输入密码"></span></p></center>

        <center><p>重复密码:<span><input type="password" required placeholder="请再次输入密码"></span></p></center>

        <center><p>注册邮箱:<span><input type="email" required placeholder="请输入邮箱"></span></p></center>

        <center><p class="a2"><span style="margin-right:33px;">性</span>别:<span><input type="radio" name="1" checked>男<input type="radio" name="1">女</span></p></center>
        
        <center><p class="a3"><span style="margin-right:33px;">副</span>业:<span><select name="province" >
            <option>老师</option>
                <option>学生</option>
                <option>医生</option>
                <option>歌手</option>
                </select></span></p></center>
        <center><p class="a1">兴趣爱好:<span><textarea name="abcde" cols="21" rows="5" required placeholder="打游戏之类的"></textarea></span></p></center>
        <hr>
        <center><button type=submit>注册</button><button type=submit>重置</button></center>
    </form>
        </body>

这里要注意写下拉列表时需要把value值加上或者用name代替

<body>
    <center>课程表</center>
<table border = 6 frame = void align = center width = 650px height = 120px >
    <tr height = 40px align = center>   
        <td>项目</td><td colspan="5">上课</td><td colspan="2">休息</td>
    </tr>
   <tr height = 40px align = center>   
       <td>星期</td><td>星期一</td><td>星期二</td><td>星期三</td><td>星期四</td><td>星期五</td><td>星期六</td><td>星期日</td>
   </tr>
   <tr height = 40px align = center>   
    <td rowspan="4">上午</td><td>数学</td><td>数学</td><td>数学</td><td>数学</td><td>数学</td><td>数学</td><td rowspan="4">休息</td>
   </tr>
   <tr height = 40px align = center>   
    <td>语文</td><td>语文</td><td>语文</td><td>语文</td><td>语文</td><td>语文</td>
   </tr>
   <tr height = 40px align = center>   
    <td>体育</td><td>体育</td><td>体育</td><td>体育</td><td>体育</td><td>体育</td>
   </tr>
   <tr height = 40px align = center>   
    <td>美术</td><td>美术</td><td>美术</td><td>美术</td><td>美术</td><td>美术</td>
   </tr>
   <tr height = 40px align = center>   
    <td rowspan="2">下午</td><td>英语</td><td>英语</td><td>英语</td><td>英语</td><td>英语</td><td>英语</td><td rowspan="2">休息</td>
   </tr>
   <tr height = 40px align = center>   
    <td>音乐</td><td>音乐</td><td>音乐</td><td>音乐</td><td>音乐</td><td>音乐</td>
   </tr>
</table>
 
</body>

这是课程表的代码

还未迟暮

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web前端学习第一天心得

第一天学习web的一点成果分享这是今天做的注册页面成果，用到一些简单的标签来写<style> body{ background-image:url("bg.jpg") } form{ width: 700px; height: 500px; margin: auto; .
复制链接

扫一扫