博客列表 >3.16作业

3.16作业

失去过去的博客
失去过去的博客原创
2018年03月16日 23:38:46697浏览

实例

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>

        <style type="text/css">
        * {
        text-align: center;
        font-family: "微软雅黑";
        }
        
        th {
        background-color: skyblue;
        }
        
        a {
        color: crimson;
        text-decoration: none;
        }
        
        a:hover {
        color: blueviolet;
        }
        .relationship{
        background-color: cadetblue;
        


        }
        img{width: 30px;}
        </style>
    </head>

<body>
                 <thead>
                    <caption>
                       <h1>家庭成员调查表</h1>                    
                    </caption>
                 </thead>
<tbody>
    <table border="1" cellspacing="0" cellpadding="20">
               <tr>
                            <th colspan="3" >调查日期2018年03月16日</th>
                            <th colspan="3">调查人:刘子涵</th>
                            <th>单位:元</th>
                            <th rowspan="2" colspan="2">操作</th>
              </tr>
              <tr>
                            <th>家庭成员</th>
                            <th>名字</th>
                            <th>职业</th>
                            <th>年龄</th>
                            <th>收入</th>
                            <th>工作单位</th>
                            <th>联系方式</th>
               </tr>
            <tr>
                    <td>父亲</td>
                    <td><img src="http://a2.att.hudong.com/65/68/20300542625208140556685069734_02_250_250.jpg"/>王思聪</td>
                    <td>战士</td>
                    <td>110</td>
                    <td>¥1.2</td>
                    <td>王者荣耀</td>
                    <td>110</td>
                    <td>
                    <a href="">编辑</a>|
                    <a href="">查询</a>
                    </td>
            </tr>
            <tr>
            <td>母亲</td>
                    <td><img src="http://news.cri.cn/gb/mmsource/images/2013/09/23/93/16210038616127991097.jpg"/>罗玉凤</td>
                    <td>法师</td>
                    <td>120</td>
                    <td>¥1.0</td>
                    <td>QQ飞车</td>
                    <td>110</td>
                    <td>
                    <a href="">编辑</a>|
                    <a href="">查询</a>
                    </td>
            </tr>
            <tr>
            <td>哥哥</td>
                    <td><img src="http://imgcache.cjmx.com/film/201607/20160703224239165.jpg"/>王大锤</td>
                    <td>射手</td>
                    <td>911</td>
                    <td>¥1.0</td>
                    <td>劲舞团</td>
                    <td>110</td>
                    <td>
                    <a href="">编辑</a>|
                    <a href="">查询</a>
                    </td>
            </tr>
            <tr>
                    <td>妹妹</td>
                    <td><img src="http://www.ntcc.com.cn/hjy/yanyuan/201406/77adf49cf58b450bab41e8b09f229d5c/images/31de3853d08e4c54a39452b79a19d300.jpg"/>王小妹</td>
                    <td>刺客</td>
                    <td>175</td>
                    <td>¥1.0</td>
                    <td>穿越火线</td>
                    <td>110</td>
                    <td>
                    <a href="">编辑</a>|
                    <a href="">查询</a>
                    </td>
            </tr>
                            <tr bgcolor="antiquewhite">
                            <td colspan="2">收入统计</td>
                            <td colspan="6">110</td>
            </tr>
    </table>
</tbody>

                                <a href="#">首页</a>
                                <a href="#">上一页</a>
                                <a href="#">1</a>
                                <a href="#">2</a>
                                <a href="#">3</a>
                                <a href="#">...</a>
                                <a href="#">下一页</a>
                                <a href="#">尾页</a>

</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

1.jpg2.jpg3.jpg4.jpg

上一条:1下一条:3.16日之表格作业
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议