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>

如图:

相关推荐
「、皓子~19 分钟前
后台管理系统的诞生 - 利用AI 1天完成整个后台管理系统的微服务后端+前端
前端·人工智能·微服务·小程序·go·ai编程·ai写作
就改了22 分钟前
Ajax——在OA系统提升性能的局部刷新
前端·javascript·ajax
凌冰_24 分钟前
Ajax 入门
前端·javascript·ajax
京东零售技术39 分钟前
京东小程序JS API仓颉改造实践
前端
老A技术联盟1 小时前
从小白入门,基于Cursor开发一个前端小程序之Cursor 编程实践与案例分析
前端·小程序
风铃喵游1 小时前
构建引擎: 打造小程序编译器
前端·小程序·架构
sunbyte1 小时前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ThemeClock(主题时钟)
前端·javascript·css·vue.js·前端框架·tailwindcss
小飞悟1 小时前
🎯 什么是模块化?CommonJS 和 ES6 Modules 到底有什么区别?小白也能看懂
前端·javascript·设计
浏览器API调用工程师_Taylor1 小时前
AOP魔法:一招实现登录弹窗的全局拦截与动态处理
前端·javascript·vue.js
FogLetter1 小时前
初识图片懒加载:让网页像"懒人"一样聪明加载
前端·javascript