HTML简单的时间登入注册界面设计

最新推荐文章于 2023-12-14 20:47:37 发布

外太空程序员

最新推荐文章于 2023-12-14 20:47:37 发布

阅读量517

点赞数 2

文章标签： html css css3

本文链接：https://blog.csdn.net/qq_48516121/article/details/121118832

版权

1.程序代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>按钮测试</title>
</head>
<body>
<link href="test.css" rel="stylesheet"type="text/css">
<div class="mr-cont">
    <h2>用户注册</h2>
    <hr width="685" color="black" >
    <form>
        <div>用户名：
            <input type="text" placeholder="请输入用户名"><font size="4" color="red">***必填项</font>
        </div>
        <div>密&nbsp;&nbsp;&nbsp;码：
            <input type="password" placeholder="请输入密码"><font size="4" color="red">***必填项</font>
        </div>
        <div>性别：
            <label><input type="radio" name="receive" checked>男</label>
            <label><input type="radio" name="receive" >女</label>
        </div>
        <div>爱好：
            <label><input type="checkbox" name="receive">游泳</label>
            <label><input type="checkbox" name="receive">上网</label>
            <label><input type="checkbox" name="receive">电影</label>
            <label><input type="checkbox" name="receive">阅读</label>
        </div>
        <div>学历：
        <select>
            <option>博士</option>
            <option>硕士</option>
            <option>本科</option>
            <option>专科</option>
            <option>中专</option>
            <option>高中</option>
            <option>初中</option>
        </select>
        </div>
        <div>上传头像：
            <input type="file">
        </div>
        <div>
            <p>个人简介：</p>
            <textarea rows="5" cols="50"></textarea>
        </div>
        <div id="btn" align="center" >
            <input type="submit" value="提交">
            <input type="button" value="保存" onclick="alert('保存信息成功')">
            <input type="reset" value="重填">
        </div>
    </form>
</div>
</body>
</html>

2.运行截图：