【练习】Html

要求:

用html相关知识实现以下网页

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>菜单</title>
</head>
<body>
    <table bordercolor="purple" border="2" cellpadding="1px" cellspacing="1px">
        <tr>
            <th colspan="10">星期一菜谱</th>
        </tr>
        <tr>
            <th rowspan="2" colspan="2">素菜</th>
            <td colspan="4">青草茄子</td>
            <td colspan="4">花椒扁豆</td>
        </tr>
        <tr>
             <td colspan="4">小葱豆腐</td>
             <td colspan="4">蚂蚁上树</td>
        </tr>
        <tr>
            <th rowspan="2" colspan="2">荤菜</th>
            <td colspan="4">油焖大虾</td>
            <td colspan="4">回锅肉</td>
        </tr>
        <tr>
            <td >
                红烧肉<img src="红烧肉.jpg" width="200px" height="200px" alt="红烧肉" title="红烧肉">
            </td>
            <td colspan="4">烤全羊</td>
        </tr>


    </table>

</body>
</html>

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>课程表</title>
</head>
<body>
    <table style="align:center" border="1" cellpadding="1px" cellspacing="1px">
        <tr>
            <td style="text-align: center" colspan="8">课程表</td>
        </tr>
        <tr>
            <th>项目</th>
            <th colspan="5">上课</th>
            <th colspan="2">休息</th>
        </tr>
        <tr>
            <td>时间</td>
            <td>星期一</td>
            <td>星期二</td>
            <td>星期三</td>
            <td>星期四</td>
            <td>星期五</td>
            <td>星期六</td>
            <td>星期日</td>
        </tr>
        <tr>
            <td rowspan="4">上午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
            <td rowspan="4">休息</td>
        </tr>
        <tr>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
        </tr>
        <tr>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
        </tr>
        <tr>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
        </tr>
        <tr>
            <td rowspan="2">下午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
            <td rowspan="2">休息</td>
        </tr>
        <tr>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>语文</td>
            <td>计算机</td>
            <td>物理</td>
        </tr>





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

 

 

要求:

用户注册

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
    <h2 style="text-align: left">     新用户注册 </h2>

    <form style="text-align: left" action="" method="get">


        <p>
            <label for="user">用户名:<br></label>
            <input type="text" name="username" id="user">
        </p>

        <p>
            <label for="pwd">密码:<br></label>
            <input type="text" name="password" id="pwd">
        </p>

        <p>爱好:<br>
            <input type="checkbox" name="hobby" value="basketball" checked="checked">篮球
            <input type="checkbox" name="hobby" value="football">足球
            <input type="checkbox" name="hobby" value="ball">网球
            <input type="checkbox" name="hobby" value="dance">舞蹈
        </p>

        <p>性别:<br>
            <input type="radio" name="sex" value="man"><input type="radio" name="sex" value="woman"></p>

        <p>籍贯:<br>
            <select name="province" id="" multiple>
                <option value="beijing">北京</option>
                <option value="hebei">河北省</option>
                <option value="yunnan">云南省</option>
                <option value="shandong">山东省</option>
            </select>
        </p>
        <p>座右铭:<br>
            <textarea name="hua" id="" cols="100" rows="3"></textarea>
        </p>

        <h4>
            <input type="submit" value="提交">
            <input type="submit" value="返回">
        </h4>



    </form>

</body>
</html>

 

posted @ 2017-12-11 18:05  小火星_Hirsi  阅读(255)  评论(0编辑  收藏  举报