建站学习网,专业提供各类建站教程,网页素材,SEO资讯等建站资源!

网站模板_网站源码_网站素材_建站教程_建站学习网

当前位置:建站学习网 > 网页设计 > HTML5教程 >

HTML教程:制作表格嵌套

更新时间:2017-04-14整理编辑:建站学习网阅读:0

        在页面中,排版是通过表格的嵌套来完成的。即一个表格内部可以套入另一个表格。原因如下:
  
  首先,网页的排版会很复杂,在外部需要有一个表格控制总体布局。如果这时一些内部排版的细节也通过总表格来实现,容易引起行高列宽等的冲突,给表格制作带来困难。
  
  其次,浏览器在解析网页的时候,是将整个表格的结构下载完毕之后才显示表格。如果不使用嵌套,表格非常复杂,浏览者要等待很长时间才能看到网页的内容。
  
  出于这些原因,引入嵌套表格。由总表格负责整体的排版,由嵌套的表格负责各个子栏目的排版,并插入到总表格的相应位置中。这样一来各司其职,互不冲突。
  
  文件范例:10-47.htm
  
  制作表格嵌套。
  
  01<!---------------------------------->
  
  02<!--文件范例:10-47.htm-->
  
  03<!--文件说明:表格嵌套-->
  
  04<!---------------------------------->
  
  05<html>
  
  06<head>
  
  07<title>表格嵌套</title>
  
  08</head>
  
  09<body>
  
  10<tableborder=3width=400height=100bordercolor=#336699align="Center">
  
  11<tr>
  
  12<tdcolspan=2align="Center">
  
  13<tableborder=1width=100%bordercolor=red>
  
  14<tr>
  
  15<tdalign="Center">Macromedia网页设计师</td>
  
  16</tr>
  
  17<tr>
  
  18<tdalign="Center">网页设计软件</td>
  
  19</tr>
  
  20</tableE>
  
  21</td>
  
  22</tr>
  
  23<tr>
  
  24<td>网页图像软件</td><td>Fireworks</td>
  
  25</tr>
  
  26<tr>
  
  27<td>网页制作软件</td><td>Dreamweaver</td>
  
  28</tr>
  
  29<tr>
  
  30<td>网页动画软件</td><TD>Flash</td>
  
  31</tr>
  
  32</table>
  
  33</body>
  
  34</html>
  
  文件说明
  
  第13行到第20行为嵌套的表格。

本文网址:https://www.dedexuexi.com/wysj/html5/2951.html

本站部分文章搜集与网络,如有侵权请联系本站,转载请说明出处。

标签:前端
收藏此文 赞一下!() 打赏本站

如本文对您有帮助,就请建站学习网抽根烟吧!

支付宝打赏
微信打赏
简单的Html转换UBB的程序
« 上一篇2017年04月14日
HTML 5 拖放简介
2017年04月14日下一篇 »
  • CSS代码鼠标经过图片变换图片的几种方法
    0阅读
    CSS代码鼠标经过图片变换图片方法如下:方法一:在css中,可以利用“:hover”选择器和“background-image”属性实现鼠标滑过改变图片效果,只需要给图片元素添加“图片元素:hover{background-image:url(新的图片路径);”样式即可。
  • 如何利用html+css设置菜单栏缓慢下拉效果?
    0阅读
    如何利用html+css设置菜单栏缓慢下拉效果?解决方法和相关代码分享如下:方法一:过渡(transition)对forum_box开启绝对定位(absolute),让里面的li从其父元素中脱离出去,不然会把之后的内容往右挤,并且设置overflow:hidden,设置高度为0,鼠标移入后再设置相应...
  • 纯css3实现下拉箭头、关闭按钮旋转效果
    0阅读
    说起css3的旋转效果,那就要说为什么不用js去实现,CSS3的动画效果,能够减少对JavaScript和Flash文件的HTTP请求这是原因之一。但是css3可能要求浏览器执行很多的工作来完成这个动画效果的渲染,这有可能导致浏览器响应缓慢,因此,在使用一些复杂的特效时,大家需要考虑清楚。不过这样的...
  • 使用HTML5的Canvas绘制曲线的简单方法
    0阅读
    Canvas2D自带的曲线方法 最近在研究3D柔体的计算,所以在狂补一些知识。经常会涉及到一些数值分析方面的东西,主要是曲线的各种插值算法。突然想起了Canvas2D本身也是可以绘制曲线的,使用
  • html两个文字之间有一个空格的解决办法
    0阅读
    碰到过这样一位朋友,在编写的html代码里面出现两个文字间有空格的情况,两个文字之间他没有加空格符,也没有代码。 这个情况在html编码使用不太多或不太熟练的情况下,很难找出问题。
 
QQ在线咨询