表单的制作

最新推荐文章于 2024-08-07 21:58:12 发布

beyoundout

最新推荐文章于 2024-08-07 21:58:12 发布

阅读量46

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/beyoundout/article/details/131604081

版权

这是一个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>
    <style>
        span[id]{-----------标签选择器，用来选中有id的span标签
            font: 900 60px "黑体";----字体： 粗细、大小、书写格式。
        }
    </style>
</head>
<body>
    <form action="#">
        <h3>青春不常在，抓紧谈恋爱</h3>
        <span>性别</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp-----#nbsp是空格
           <input type="radio" value="nan" checked>男-----checked默认选中，radio==单选框
           <input type="radio" value="nv">女<br/>
        <span>生日</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp 
           <select>
             <option value="nian" >请选择年</option>
             <option value="1999" >1999</option>
             <option value="2000" >2000</option>
             <option value="2001" >2001</option>
             <option value="2002" >2002</option>
             <option value="2003" >2003</option>
           </select>
           <select>-----------------------------单拉选框
             <option value="yue" >请选择月</option>
             <option value="1" >1</option>
             <option value="2" >2</option>
             <option value="3" >3</option>
             <option value="4" >4</option>
             <option value="5" >5</option>
             <option value="6" >6</option>
             <option value="7" >7</option>
             <option value="8" >8</option>
             <option value="9" >9</option>
             <option value="10" >10</option>
             <option value="11" >11</option>
             <option value="12" >12</option>
           </select>
           <select>
             <option value="ri" >请选择日</option>
             <option value="1" >1</option>
             <option value="2" >2</option>
             <option value="3" >3</option>
             <option value="4" >4</option>
             <option value="18" >118</option>
             <option value="22" >22</option>
             <option value="24" >24</option>
             <option value="26" >26</option>
             <option value="28" >28</option>
             <optin value="29" >29</option>
             <optioon value="29" >29</option>
             <option value="30" >30</option>
           </select><br/> 
        <span>所在地区</span>&nbsp;&nbsp
           <input type="text" name="dq" id="" placeholder="北京思密达"><br/>----text==文本框
        <span>婚姻状况</span>&nbsp;&nbsp
           <input type="radio" name="hyzk">未婚
           <input type="radio" name="hyzk">已婚
           <input type="radio" name="hyzk">离婚 <br/> 
        <span>学历</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp
           <input type="text" name="xl" id="" placeholder="幼儿园"><br/>
        <span>喜欢类型</span>&nbsp;&nbsp
           <input type="checkbox" name="xhlx">抚媚的-----checkbox==多选框
           <input type="checkbox" name="xhlx" checked>可爱的
           <input type="checkbox" name="xhlx">小鲜肉
           <input type="checkbox" name="xhlx">老腊肉
           <input type="checkbox" name="xhlx">都喜欢 <br/>
        <span>自我介绍</span>&nbsp;&nbsp 
           <textarea rows="2" cols="18" placeholder="自我介绍"></textarea><br/>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<button>免费注册</button><br/>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<input type="checkbox" name="bz">我同意注册和会员加入标准<br/>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<a href="C:\Users\姜汁撞牛奶\Desktop\微信图片_202307062129552.jpg">我是会员，立即注册</a><br/>
           <br/>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="">我承诺</span><br />    
    <ul>
        <ul>
            <ul>
                <ul>
        <li>年满18岁、单身</li>
        <li>抱着严肃的态度</li>
        <li>真诚寻找另一半</li>
                </ul>
            </ul>
        </ul>
    </ul>    

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