用HTML做一个简单的相亲网站页面

凝昤

于 2024-03-29 16:04:34 发布

阅读量333

点赞数 4

文章标签： html5 css

本文链接：https://blog.csdn.net/aaa13312/article/details/137148574

版权

本文档展示了HTML代码示例，详细描述了一个用于网络交友的简单注册表单，包括昵称输入、性别选择、城市选项、婚恋状况和喜好设置，以及用户协议确认部分。

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<H1>青春不常在，抓紧谈恋爱</H1>
<hr>
<form action="">
    昵称：
     <input type="text" placeholder="请输入昵称">
    <br><br>
    性别： 
    <label ><input type="radio" name="sex" checked>男</label>
    <label ><input type="radio" name="sex">女</label>
    <br><br>
    所在城市：
    <select>
        <option >北京</option>
        <option >上海</option>
        <option selected >深圳</option>
        <option >广州</option>
    </select>
    <br><br>
    婚宴状况：
    <label> <input type="radio" name="marry">未婚</label>
    <label> <input type="radio" name="marry">已婚</label>
    <label> <input type="radio" name="marry" checked>保密</label>
    <br><br>
    喜欢的类型：
    <label ><input type="checkbox" checked>可爱</label>
    <label ><input type="checkbox" checked>萝莉</label>
    <label ><input type="checkbox" >御姐</label>
    <label ><input type="checkbox" >性感</label>
    <br><br>
    个人介绍：<br>
    <textarea   cols="60" rows="10"></textarea>
    <h3>我承诺</h3>
    <ul>
        <li>年满18岁，单身</li>
        <li>抱着严肃的态度</li>
        <li>真诚寻找另一半</li>
    </ul>
    <label ><input type="checkbox">我同意所有条款</label>
    <br><br>
    <input type="submit" value="免费注册">
    <button type="reset">重置</button>
    
</form>
</body>
</html>