web前端-HTML常用标签-综合案例

如图:

代码如下:

html 复制代码
<!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>
   <h3>青春不常在,抓紧谈恋爱</h3><br>
   <form action="get"><br>
   性别:女<input type="radio" name="sex" value="女"> 男<input type="radio" name="sex" value="男"><br>
   <tr>
    <td>生日:</td>
    <td>
        <select>
            <option>请选择年份</option>
            <option>2001</option>
            <option>2002</option>
            <option>2003</option>
            <option>2004</option>
        </select>
        <select>
            <option>请选择月份</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
            <option>6</option>
            <option>7</option>
            <option>8</option>
            <option>9</option>
            <option>10</option>
            <option>11</option>
            <option>12</option>
        </select>   
    </td>
   </tr>
   <br>
   婚姻状况:未婚<input type="radio"> 已婚<input type="radio"> 离婚<input type="radio"><br>
   学历:
   <select>
    <option>幼儿园</option>
    <option>小学</option>
    <option>初中</option>
    <option>高中</option>
    <option>专科</option>
    <option>本科</option>
    <option>研究生</option>
    <option>博士生</option>
   </select><br>
   喜欢的类型:A<input type="checkbox"> B<input type="checkbox"> C<input type="checkbox"> D<input type="checkbox"> <br>
   自我介绍:
   <textarea rows="3" cols="20"></textarea><br>
   地区:
   <select>
    <option>河北</option>
    <option>山西</option>
    <option>辽宁</option>
    <option>吉林</option>
    <option>黑龙江</option>
    <option>江苏</option>
    <option>浙江</option>
    <option>安徽</option>
    <option>福建</option>
    <option>江西</option>
    <option>山东</option>
    <option>河南</option>
    <option>湖北</option>
    <option>湖南</option>
    <option>广东</option>
    <option>海南</option>
    <option>四川</option>
    <option>贵州</option>
    <option>云南</option>
    <option>陕西</option>
    <option>甘肃</option>
    <option>青海</option>
    <option>台湾</option>
    <option>内蒙古</option>
    <option>广西</option>
    <option>西藏</option>
    <option>宁夏</option>
    <option>新疆</option>
    <option>北京</option>
    <option>天津</option>
    <option>上海</option>
    <option>重庆</option>
    <option>香港</option>
    <option>澳门</option>
   </select><br>

   <button>免费注册</button><br>
   <input type="checkbox">我同意注册条款和会员加入标准<br>
   <a href="https://blog.csdn.net/2301_79188932/article/details/142093961?spm=1001.2014.3001.5501">我是会员,立即登录</a><br>

   </form>

   <h1>我承诺</h1>
   <ul>
    <li>年满十八岁 单身</li>
    <li>抱着严肃的态度</li>
    <li>真诚寻找另一半</li>
   </ul>

</body>
</html>

如图:

相关推荐
程序员黑豆3 小时前
Java类型推断完全指南:从var到菱形运算符,掌握使用限制与最佳实践
java·前端·ai编程
To_OC3 小时前
踩了个 TS 的坑之后,我终于把 type 和 interface 掰明白了
前端·react.js·typescript
GreenTea3 小时前
深度解读 Anthropic 多智能体报告:更强的模型 ≠ 更好的协调
前端·后端·算法
浮生望4 小时前
前端API工程化:用 Mock 数据与 Axios 配置实现独立于后端的并行开发
前端
万少4 小时前
给 DeepSeek Harness 装个"应用商店":一条命令,595 个插件随你逛
前端·javascript·后端
波波0074 小时前
C# 15 重磅新特性: 带标签 break 与 continue:重新定义嵌套循环控制流
服务器·前端·c#
Brown.alexis5 小时前
es6知识点1-自备使用
前端·ecmascript·es6
小爬的老粉丝6 小时前
JavaScript 纯前端预览 WPS:先识别容器,再路由解析器
前端·javascript·wps
计算机魔术师7 小时前
新兴多智能体系统的模式与问题
前端
用户059540174467 小时前
AI Agent 上下文污染踩坑实录:用 pytest + Redis 揪出 3 类记忆串号 bug,排查 6 小时
前端·css