HTML中 table 中的跨行跨列怎么拼写?

 我来答
码农小明哥
2017-03-25 · 互联网程序员一枚,欢迎交流
码农小明哥
采纳数:9602 获赞数:25062

向TA提问 私信TA
展开全部

Html中的table元素中,colspan 属性规定单元格可横跨的列数即跨列,rowspan 属性规定单元格可横跨的行数跨行。

两个属性的代码实例如下:

1、表格单元横跨两列的表格:

<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td colspan="2">January</td><!--设置横跨两列-->
  </tr>
  <tr>
    <td colspan="2">February</td><!--设置横跨两列-->
  </tr>
</table>

结果:

2、表格单元横跨两行的表格:

<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100.00</td>
    <td rowspan="2">$50</td><!--设置横跨两行-->
  </tr>
  <tr>
    <td>February</td>
    <td>$10.00</td>
  </tr>
</table>

欧阳宇轩yk3wR
2018-03-31 · TA获得超过1.4万个赞
知道小有建树答主
回答量:111
采纳率:100%
帮助的人:4.1万
展开全部

<tr rowspan="2"><!--两行--> 

<td colspan="2" >两行两列  </td><!--两列-->

</tr>

HTML中table表格布局:

  • 传统table布局方式实际上是利用了HTML 

  • table表格元素具有的无边框特性。由于table元素可以在显示时使得单元格格边框和间距设置为0,即不显示边框,因此可以将网页中的各个元素按版式划分放入各个表格中,从而实现复杂的排版组合。

  • table布局的核心在于设计一个能满足版式要求的表格结构

  • 将内容装入每个单元格中,间距及定格则通过插入图像进行占位来实现,最终的结构是一个复杂的表格,不利于设计和修改。

    表格布局的代码最常见的是在HTML标签<>之间加入一些设计代码,入width="100%",border="0"等,表格布局的混合代码就是这样编写的。大量样式设计代码混杂在表格、单元格之中,使得可读性大大降低,维护起来成本相当高。尽管Dreamweaver这样优秀的网页制作软件能帮助我们可视化的进行这些代码的编写,但是Dreamweaver永远不会智能的帮助你缩减代码或删除重复代码。

    复杂的表格设计使得设计极为不易,修改更加复杂,最后生成的网页代码除了表格本身的代码,还有许多没有意义的图像占位符及其他元素,文件量庞大,最终导致浏览器下载及解析速度变慢。

  • 用CSS布局则可以从根本上改变这种情况

    DIV在使用时不需要像表格一样通过其内容的单元格组织版式,通过CSS强大的样式定义功能可以比表格更简单更自由的来控制页面版式及样式。

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友b24d881c0
2011-03-20 · TA获得超过214个赞
知道答主
回答量:87
采纳率:0%
帮助的人:29.4万
展开全部
<tr rowspan="2">
<td colspan="2" >两行两列 </td>
</tr>
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
朝奈纯02
2011-03-20 · TA获得超过458个赞
知道小有建树答主
回答量:159
采纳率:0%
帮助的人:220万
展开全部
<td colspan="2" rowspan="2">两行两列
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式