行颜色设置的简便方法昨天我们在《使用HTML添加表格3（间距与颜色）——零基础自学网页制作》中学习了设置单元格以及其中内容的空间间距和背景颜色。其中添加列向单元格背景颜色只需要修改对应的tr标签中的style属性，而修改行向标签需要修改不同tr/tr标签中的td标签的style属性，这样操作起来就非常的麻烦，那有没有简便的修改行向单元格背景颜色的方法呢？当然有！开发团队给出了colgroupcol/col/colgroup这样的组合来解决这个问题，下面让我们详细学习。colgroup/colgroup标签是一个给行向单元格打组的标签，在页面中不会显示。col/col标签是来具体设置行向单元格数量和颜色的标签。示例代码如下：colgroupcolspan=1style=background-color:#ff;/col/colgroup这段代码添加到第一个页面.html当中就可以，具体代码如下：!DOCTYPEHTMLhtmlheadtitle第一个网页/title/headbodyh1第一个网页/h1hrh2表格元素/h2hrtableborder=1width=%theadtrtdcolspan=2表格的头部信息/td/tr/theadtfoottrtdcolspan=2表格的脚部信息/tdtr/tfoottbodycaption表格标题/captioncolgroupcolspan=1style=background-color:#ff;/col/colgrouptrth姓名/thth年龄/th/trtrtd一列一行/tdtd一列二行/td/trtrtd二列一行/tdtd二列二行/td/tr/tbody/table/body/html页面效果如图：因为第一列和最后一列只有一行所以，也都变红了。其中span的数量代表行数。如果把span等号后面的数改成2，因为表格只有两行，所以整个表格都红了。表格嵌套我们可以通过向表格中添加表格实现表格嵌套。表格嵌套可以把一个单元格分成行向或列向分割单元格。代码示例如下：我们把一列一行分割成列向两个单元格。trtdtableborder=1width=%trtd1/tdtd2/td/tr/table/td使用tableborder=1width=%trtd1/tdtd2/td/tr/table这段代码替换文字一列一行即可。页面效果如图所示：留个思考题，大家可以思考一下行向分割单元格怎么写。今天的内容结束了。全部示例代码如下：!DOCTYPEHTMLhtmlheadtitle第一个网页/title/headbodyh1第一个网页/h1hrh2表格元素/h2hrtableborder=1width=%theadtrtdcolspan=2表格的头部信息/td/tr/theadtfoottrtdcolspan=2表格的脚部信息/tdtr/tfoottbodycaption表格标题/captioncolgroupcolspan=1style=background-color:#ff;/col/colgrouptrth姓名/thth年龄/th/trtrtdtableborder=1width=%trtd1/tdtd2/td/tr/table/tdtd一列二行/td/trtrtd二列一行/tdtd二列二行/td/tr/tbody/table/body/html喜欢的小伙伴请
转载请注明：http://www.aierlanlan.com/cyrz/8082.html
