HTML--关于form表单//邮箱登录

最新推荐文章于 2024-06-11 11:52:34 发布

Wangling_blog

最新推荐文章于 2024-06-11 11:52:34 发布

阅读量1k

点赞数 10

分类专栏：随笔文章标签： html 前端

本文链接：https://blog.csdn.net/Wangling_blog/article/details/121846740

版权

随笔专栏收录该内容

34 篇文章 1 订阅

订阅专栏

制作结果：

相关代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>关于form表单的实现</title>
    <style>
        form{
            background-color:bisque;
            width:30%;
            height:420px
        }
    </style>
</head>
<body>
    <form action="http://www.baidu.com/">
        <div>
            邮箱地址：
            <input type="text" name="name" id="name">
            @
            <select name="email">
                <option value="163.com">163.com</option>
                <option value="163.com">qq.com</option>
                <option value="163.com">126.com</option>
            </select>
        </div>
        <br>
        <div>
            密码：
            <input type="password" name="password">
        </div>
        <br>
        <div>
            性别：
            <input type="radio" name="gender" value="男">男
            <input type="radio" name="gender" value="女">女
        </div>
        <br>
        <div>
            验证码：
            <input type="text">
            <img src="验证码.png" title="这是验证码" width="20">
        </div>
        <br>
        <div>
            <button type="button">免费获取验证码</button>
        </div>
        <br>
        <div>
            备注：
            <textarea name="tips" rows="5" cols="20" style="resize:none;"></textarea>
        </div>
        <br>
        <div>
            <button>提交</button>
        </div>
        <br>
        <div>
            <input type="checkbox" name="read">我已阅读并同意<a href="#">XXX协议</a> 和隐私政策。
        </div>

    </form>
</body>
</html>