表单实例--注册页面

最新推荐文章于 2023-08-12 19:04:32 发布

慕慕和小绵羊

最新推荐文章于 2023-08-12 19:04:32 发布

阅读量320

点赞数

分类专栏：前端Vscode 文章标签： html5 表单

本文链接：https://blog.csdn.net/qq_46617150/article/details/129110027

版权

前端Vscode 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

实现效果

在这里插入图片描述

实现代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h4>青春不常在，抓紧谈恋爱</h4>
    <form>
    <table >
       
        <tr>
            <td>性别</td>
            <td>
                <label for="nan">男</label>
                <input type="radio" id="nan" name="sex">
                <label for="nv">女</label>
                <input type="radio" id="nv" name="sex">
            </td>
        </tr>
        <tr>
            <td>生日</td>
            <td>
                <select>
                    <option>--请选择年份--</option>
                    <option>2000</option>
                    <option>2010</option>
                    <option>2020</option>
                </select>
            </td>
            <td>
                <select>
                    <option>--请选择月份--</option>
                    <option>2</option>
                    <option>6</option>
                    <option>8</option>
                </select>
            </td>
            <td>
                <select>
                    <option>--请选择日期--</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>所在地区</td>
            <td><input type="text" value="上海"></td>
        </tr>
        <tr>
            <td>婚姻状况</td>
            <td>
                <input type="radio" name="condiction" id="nomarried" checked="checked">未婚
                <input type="radio" name="condiction" id="married">已婚
                <input type="radio" name="condiction" id="leavemarried">离婚
            </td>
        </tr>
        <tr>
            <td>学历</td>
            <td>
                <input type="text" value="幼儿园">
            </td>
        </tr>
        <tr>
            <td>喜欢的类型</td>
            <td>
                <input type="checkbox" name="like" id="wm">妩媚的
                <input type="checkbox" name="like" id="cute">可爱的
                <input type="checkbox" name="like" id="xxr">小鲜肉
                <input type="checkbox" name="like" id="llr">老腊肉
                <input type="checkbox" name="like" id="all">都喜欢

            </td>
        </tr>
        <tr>
            <td>自我介绍</td>
            <td>
                <textarea>
                    自我介绍
                </textarea>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="submit" value="免费注册"><br>
                <input type="checkbox" name="agree" id="ty" checked="checked">我同意注册条款和会员加入标准<br>
                <a href="#">我是会员，立即登录</a><br>
                <h3>我承诺</h3><br>
                <ur>
                    <li>年满18岁，单身</li>
                    <li>抱有严肃的态度</li>
                    <li>真诚的寻找另一半</li>
                </ur>

            </td>
        </tr>
    </table>
    </form>
   
</body>
</html>