Bootstrap

前端学习-综合案例-表单

<!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>

    <h1>青春不常在,抓紧谈恋爱</h1>

    <hr>

<form action="">

    昵称:&nbsp;&nbsp;

    <input type="text" placeholder="请输入昵称">

    <br><br>

    性别:&nbsp;

    <label><input type='radio' name="sex" checked>男</label>

        <label><input type='radio' name="sex">女</label>

    <br><br>

    所在城市: &nbsp;

    <select>

        <option>上海</option>

        <option>北京</option>

        <option>天津</option>

    </select>

    <br><br>

    婚姻状况:&nbsp;

    <label><input type="radio" name="marital ">未婚</label>

    <label><input type="radio" name="marital ">已婚</label>

    <label><input type="radio" name="marital ">保密</label>

    <br><br>

    喜欢的类型:&nbsp;

    <label><input type="checkbox" name="like" checked>可爱</label>

    <label><input type="checkbox" name="like" checked>性感</label>

    <label><input type="checkbox" name="like">御姐</label>

    <label><input type="checkbox" name="like">萝莉</label>

    <label><input type="checkbox" name="like">小鲜肉</label>

    <label><input type="checkbox" name="like">大叔</label>

    <br><br>

    个人介绍:

    <br><br>

    <textarea name="" id="" cols="60" rows="10"></textarea>

    <br><br>

    <h3>我承诺</h3>

    <ul>

        <li>年满18岁,单身</li>

        <li>抱着严肃的态度</li>

        <li>真诚寻找另一半</li>

    </ul>

    <br><br>

    <input type="radio">我同意所有条款

    <br><br>

    <button type="submit" >免费注册</button>

    <input type='reset' value="重置">


 

</form>

       

</body>

</html>

悦读

道可道,非常道;名可名,非常名。 无名,天地之始,有名,万物之母。 故常无欲,以观其妙,常有欲,以观其徼。 此两者,同出而异名,同谓之玄,玄之又玄,众妙之门。

;