前端HTML学习之案例--表单

用《前端HTML学习》文章里的内容完成一个表单案例

效果图

实现代码

    <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 selected>上海</option>
            <option>南京</option>
            <option>内蒙古</option>
        </select>
        <br><br>
        婚姻状况：
        <label><input type="radio" name="hun" checked>未婚</label>
        <label><input type="radio" name="hun">已婚</label>
        <label><input type="radio" name="hun">保密</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>
        <label><input type="checkbox" >小鲜肉</label>
        <label><input type="checkbox" >大叔</label>
        <br><br>
        个人介绍：<br><br>
        <textarea  cols="60" rows="10"></textarea>
        <br><br>
        <h2>我承诺</h2>
        <ul>
            <li>年满18岁，单身</li>
            <li>绝对态度认真</li>
            <li>寻找另一半</li>
        </ul>
        <br><br>
        <label><input type="checkbox" >我同意所有条款</label>
        <br><br>
        <input type="submit" value="免费注册">
        <button type="reset">重置</button>
    </form>