前端学习1——注册页面练习前端（黑马程序员教程）综合案例-注册页面 html代码性别、生日、地区、婚姻状况、学历、喜

初学前端，学习记录1——注册页面练习

<!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>综合案例-注册页面</title>
</head>
<body>
    <h4>青春不常在，抓紧谈恋爱</h4>
    <table width="700">
        <!-- first line -->
        <tr>
            <td>性别：</td>
            <td>
                <input type="radio" name="sex" checked="checked"> 男
                <input type="radio" name="sex"> 女
            </td>
        </tr>
        <!-- sec line -->
        <tr>
            <td>生日：</td>
            <td>
                <select>
                    <option>请选择年份</option>
                    <option>2001</option>
                    <option>2002</option>
                    <option>2003</option>
                </select>
                <select>
                    <option>请选择月份</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
                <select>
                    <option>请选择日期</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </td>
        </tr>
        <!-- thi line -->
        <tr>
            <td>所在地区：</td>
            <td><input type="text" value="北京欸"></td>
        </tr>
        <!-- forth line -->
        <tr>
            <td>婚姻状况：</td>
            <td>
                <input type="radio" name="marry" checked="checked"> 已婚
                <input type="radio" name="marry"> 未婚
                <input type="radio" name="marry"> 离婚
            </td>
        </tr>
        <!-- fif line -->
        <tr>
            <td>学历：</td>
            <td><input type="text" value="本科"></td>
        </tr>
        <!-- six line -->
        <tr>
            <td>喜欢类型：</td>
            <td><input type="checkbox" name="love">清纯</td>
            <td><input type="checkbox" name="love">可爱</td>
            <td><input type="checkbox" name="love">性感</td>
            <td><input type="checkbox" name="love">知性</td>
            <td><input type="checkbox" name="love" checked="checked">都喜欢 </td>

        </tr>
        <!-- sev line -->
        <tr>
            <td>自我介绍：</td>
            <textarea>个人简介</textarea>
        </tr>
        <!-- 8 -->
        <tr>
            <td></td>
            <td><input type="submit" value="免费注册"></td>
        </tr>
        <!-- 9 -->
        <tr>
            <td></td>
            <td><input type="checkbox" checked="checked">我同意加入</td>
        </tr>
        <!-- 10 -->
        <tr>
            <td></td>
            <td>
                <a href="#">已注册，登录</a>
            </td>
        </tr>
        <!-- 11 -->
        <tr>
            <td></td>
            <td>
                <h3>我承诺</h3>
                <ul>
                    <li>年满18岁，单身</li>
                    <li>态度严肃</li>
                    <li>真诚求偶</li>
                </ul>
            </td>
        </tr>

    </table>
</body>
</html>

效果图：

效果图.png

问题：第六行“喜欢类型”那一栏，第一项与后面几项不知道为什么相隔距离特别大，等后续知道解决方法了再来修改。