课间活动的表格怎么实现，想了很久也想不出来

课间活动的表格怎么实现，想了很久也想不出来


http://img1.sycdn.imooc.com//climg/5b23b08d0001322210220410.jpg
感觉很难实现，是我想的方向错了嘛？
gum11 2018-06-15
源自：HTML表格   2-23 编程练习
60
收起

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论，去登陆吧

30回答
qq_人_20 2018-09-05 21:00:44
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html>
 
    <head>
        <title>表格属性</title>
        <meta charset="utf-8">
    </head>
 
    <body>
        <!-- 在以下表格标签中添加相应代码 -->
        <table border="1" width="500" cellspacing="0" cellpadding="5px" align="center">
            <caption>课程表</caption>
            <tr bgcolor="orange" align="center">
                <th>星期一</th>
                <th>星期二</th>
                <th>星期三</th>
                <th>星期四</th>
                <th>星期五</th>
            </tr>
            <tr align="center">
                <td rowspan="2">语文</td>
                <td>数学</td>
                <td>化学</td>
                <td>英语</td>
                <td>生物</td>
            </tr>
            <tr align="center">
             
                <td>数学</td>
                <td>化学</td>
                <td>英语</td>
                <td>生物</td>
            </tr>
            <tr align="center">
                <td  colspan="5">课间活动</td>
     
            </tr>
            <tr align="center">
                <td rowspan="2">
                    <table border="1" frame="void">
                    <tr>
                            <td>前半节</td>
                            <td>后半节</td>
                    </tr>
                    <tr>
                            <td>诗词</td>
                            <td>古文</td>
                    </tr>
                    </table>
                </td>
                <td>数学</td>
                <td>化学</td>
                <td>英语</td>
                <td>生物</td>
            </tr>
            <tr align="center">
 
                <td>数学</td>
                <td>化学</td>
                <td>英语</td>
                <td>生物</td>
            </tr>
        </table>
    </body>
</html>


0
收起回答
落日的猪猪 2018-08-31 16:56:32

colspan="5"

0
收起回答
Walker游游 2018-08-26 16:31:48
1
2
3
4
<tr align="center">
    <td colspan="4">课间活动</td>
     
   </tr>


0
收起回答
1122mrsdong 2018-08-23 14:56:48

colspan="5"

0
收起回答
慕慕3416675 2018-08-22 23:04:12

把第四个<tr></tr>,即第四行的第一列改成<td colspan="5"></td>,并且后面的<td></td>全删了

0
收起回答
小鱼0319zn 2018-08-20 18:37:15

0
收起回答
_是你_ 2018-08-20 18:28:01

               

test

0
收起回答
qq_鸭绿桥第一帅哥_0 2018-08-20 18:22:40

<table border="1" width="900" cellspacing="0" cellpadding="5px" align="center">

<caption>课程表</caption>

<tr bgcolor="orange" align="center">

<th>星期一</th>

<th>星期二</th>

<th>星期三</th>

<th>星期四</th>

<th>星期五</th>

</tr>

<tr align="center">

<td rowspan="2">语文</td>

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td colspan="5">课间活动</td>

</tr>

<tr align="center">

<td rowspan="2">

<table border="1" cellspacing="0">

<tr>

<td>前半节</td>

<td>后半节</td>

</tr>

<tr>

<td>诗词</td>

<td>古文</td>

</tr>

</table>

</td>

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

</table>


0
收起回答
你是我的河豚鱼 2018-08-10 23:00:31

建议你复习前面的表格合并的章节，自己能写出来的话，这个题目没难度吧

1
收起回答
以气御码 2018-08-09 17:18:57

还在慕课？一个“课件活动”占据了5个格子，所以多余的4个直接删掉，只留下1个并使用colspan=5来实现

原代码：

1
2
3
4
5
6
7
<tr align="center">
    <td>课间活动</td>
    <td>课间活动</td>
    <td>课间活动</td>
    <td>课间活动</td>
    <td>课间活动</td>
</tr>

实现：

1
2
3
<tr align="center">
    <td colspan="5">课间活动/td>
</tr>


1
收起回答
救世的程序员 2018-08-08 16:43:37
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html>
<head>
    <title>课程表</title>
</head>
<body>
<table cellspacing="0" width="500px" border="1">
    <caption>课程表</caption>
    <thead>
        <tr>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td rowspan="2">语文</td>
            <td>数学</td>
            <td>化学</td>
            <td>英语</td>
            <td>生物</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>数学</td>
            <td>数学</td>
            <td>数学</td>
        </tr>
        <tr>
            <td align="center" colspan="5">课间活动</td>
        </tr>
        <tr>
            <td rowspan="2">
                <table cellspacing="0" align="center" border="1">
                    <tr>
                        <td>前半节</td>
                        <td>后半节</td>
                    </tr>
                    <tr>
                        <td>诗词</td>
                        <td>古文</td>
                    </tr>
                </table>
            </td>
            <td>数学</td>
            <td>滑雪</td>
            <td>英语</td>
            <td>生物</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>滑雪</td>
            <td>英语</td>
            <td>生物</td>
        </tr>
    </tbody>
    <tfoot>
         
    </tfoot>
</table>
</body>
</html>


0
收起回答
Gabriel23 2018-08-05 16:32:33

<td colspan = "5">课间活动</td>

0
收起回答
sunshine_mtt 2018-07-31 15:00:48

<!DOCTYPE html>

<html>


    <head>

<title>表格属性</title>

<meta charset="utf-8">

</head>


<body>

<table border="1" width="500" cellspacing="0" cellpadding="5px" align="center">

<caption>课程表</caption>

<tr bgcolor="orange" align="center">

<th>星期一</th>

<th>星期二</th>

<th>星期三</th>

<th>星期四</th>

<th>星期五</th>

</tr>

<tr align="center">

<td rowspan="2">语文</td>

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td colspan="5">课间活动</td>

</tr>

<tr align="center">

<td rowspan="2">

<table border="1" cellspacing="0">

    <tr>

        <td>前半节</td>

        <td>后关节</td>

    </tr>

    <tr>

        <td>诗词</td>

        <td>古文</td>

    </tr>

</table>

</td>

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>数学</td>

<td>化学</td>

<td>英语</td>

<td>生物</td>

</tr>

</table>

</body>

</html>


0
收起回答
一昭 2018-07-29 15:23:43

如果是3*3的表：

添加一行：所有列会增加增加一个单元格（在<tr>下面在加一个<tr>就行，就变成4*3，这个简单）

添加一列：所有行会增加一个单元格（在每个<tr>里面增加一个<td>就是3*4了）

合并跨行单元：最开始发起跨行的<td>会+1，会吧下面的单元格挤出去，所以把其他<tr>的<td>删除就行。


0
收起回答
妮可妮可妮_ 2018-07-29 12:52:56

colspan 属性规定单元格可横跨的列数。

rowspan 属性规定单元格可横跨的行数。

可以使用这两个属性来完成表格,下面已经有同学做出来了哦~同学可以参考一下,动动手自己实现效果,加油~

0
收起回答
qq_夜游人_0 2018-07-28 14:37:00

<td colspan="5"></td>

0
收起回答
qq_马儿想带你去看风中的世界_0 2018-07-27 17:28:11

我猜你是行和列混淆了吧 多多练习  很简单的  实在不懂就多看两遍课程

0
收起回答
慕虎5538247 2018-07-24 15:14:42

你在课间活动那一行只写

<tr align="center">

        <td colspan="4">课间活动</td>

</tr>

就可以了 多余的三条删除掉

colspan实现单元格之间的合并

0
收起回答
桃花魂归何处 2018-07-23 21:04:18

<tr align="center">

<td colspan="4">课间活动</td>


</tr>

用colspan来实现列合并

0
收起回答
慕斯2218915 2018-07-18 13:14:11

<!DOCTYPE html>

<html>


    <head>

<title>表格属性</title>

<meta charset="utf-8">

</head>


<body>

<!-- 在以下表格标签中添加相应代码 -->

<table border="1" width="500" cellspacing="0" cellpadding="5px" align="center">

<caption>课程表</caption>

<tr bgcolor="orange" align="center">

<th>星期一</th>

<th>星期二</th>

<th>星期四</th>

<th>星期五</th>

</tr>

<tr align="center">

<td>语文</td>

<td>数学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>语文</td>

<td>数学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td colspan="4">课间活动</td>

</tr>

<tr align="center">

<td rowspan="2">

    <table border="1">

        <tr>

            <td>前半节</td>

            <td>后半节</td>

        </tr>

        <tr>

            <td>诗句</td>

            <td>古文</td>

        </tr>

    </table>

</td>

<td>数学</td>

<td>英语</td>

<td>生物</td>

</tr>

<tr align="center">

<td>数学</td>

<td>英语</td>

<td>生物</td>

</tr>

</table>

</body>

</html>


0
收起回答
首页上一页12下一页尾页
问题已解决，确定采纳
还有疑问，暂不采纳

恭喜解决一个难题，获得1积分~

来为老师/同学的回答评分吧

0 星

相似问题

表格中的“课间活动”为什么不是一行显示，而是分了两行？
21 0 10
表格嵌套可以达到表格合并的效果吗？
5 0 3
老师我想问一下我的截图中的日期是怎样做出来的？
10 1 3
现在遇到一个很现实的问题
47 4 4
我这个表格太长了，有什么方法可以显示滚动条，滑动查看溢出的部分
1 0 5

登录后可查看更多问答，登录/注册

前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36712    个

从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！

了解课程

本课精华内容

问答 作业

为什么我的没有框

5 45

表格的问题

377 41

大家好,body前面有一个红色的小××，麻烦大家帮我看看

378 40

到底是cellspacing还是cellpacing?

0 35

课间活动的表格怎么实现，想了很久也想不出来

60 30

查看更多本课问答
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

 帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

 公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码，添加
你的专属老师
插入代码