中国信息港旗下网站    《中华人民共和国增值电信业务经营许可证》(ICP)编号:京B2-20070158(ISP) 京ICP证050145号     企业在线客服QQ:800015119
第一万维网
第一万维网
纯技术文章
注册域名|虚拟主机|企业邮箱|服务器|网页设计|优化推广|业界新闻|网站建设经验|网站赚钱经验|公司公告|ASP技术|PHP技术|ASP.NET技术|
JAVA技术|设计理念|Dreamweaver教程|Fireworks教程|Flash教程|Divcss教程| FrontPage教程|Photoshop教程|Web标准|数据库|
您现在的位置: 第一万维网 >> 网站建设经验 >> 正 文

网站设计的思考(10)_网页中表格的运用

来源:第一万维网 更新时间:2010-2-19 23:48:51
内容简介:
表格(table)是页面的重要元素,是页面排字的主要手段。只管DHTML中的层(layer)也合格完成主页元素的自由定位,但是表格显然更加方便编辑与修改。熟练掌握和运用表格的各种属性,合格让您的页面看兴

  表格(table)是页面的重要元素,是页面排字的主要手段。只管DHTML中的层(layer)也合格完成主页元素的自由定位,但是表格显然更加方便编辑与修改。熟练掌握和运用表格的各种属性,合格让您的页面看兴起赏心悦目。
  本文将分两部分详细介绍表格在主页设计中的运用。容纳表格的根本用法和表格运用的注意点。
  一.表格的根本用法。
  表格的根本用法相信您已经非常熟悉了。但为了保证书作品的完整性,阿捷在这里还是再罗列一遍。
  ●表格的HTML根本语法

<table>...</table> - 定义表格
<tr> - 定义表行
<th> - 定义表头
<td> - 定义表元(表格的具体数据)
相似:
<table border>
<tr><th>1</th>
<th>2</th>
<th>3</th>
<tr><td>A</td>
<td>B</td>
<td>C</td>
</table>
123
ABC

 
  ●table标签的参数。table标签合格含下列参数。
border 表格边框
cellspacing 表元之间的空白距离
cellpadding 表元内部的空白距离
width 表格宽度(合格用%或者具体数据意味)
height 表格高度

相似:
<table border=5 cellpadding=10>
<tr><th>1</th><th>2</th><th>3</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
123
ABC

  ●表格的对齐方式
  1.表格内的文字对齐。
  语法:<td align=#> 过程#合格设定的参数有:
left 横向居左
center 横向从中
right 横向居右
top 纵向居顶
middle 纵向从中
bottom 纵向居底
相似:
<table border height=100>
<td valign=top>A</td>
<td valign=middle>B</td>
<td valign=bottom>C</td>
</table>
ABC

  2.表格在页面内的对齐。
  如果你欲望与表格并排放一段文字,就欲望用到table标签的另一度个参数:
  <table align=#> 过程#合格设定为left(居左),right(居右)
  相似:
<table align="left" border >
<tr><th>1</th><th>2</th><th>3</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
这里的文字<br>
是和表格并排排放的
   123
ABC
这里的文字是和表格并排排放的

●表格的嵌套
  表格嵌套就是在表格里插入表格,嵌套的排字方法就是将要插入的表格当做文字来治理同样使用<td align=#>语句。
  相似:
<table border width=200 height=100>
<tr> <td valign="top" >
<table border><tr><td></td></tr></table>
</td><td valign="bottom">
<table border><tr><td></td></tr></table>
</td></tr>
</table>


  ●表格的颜色
  表格的颜色也在<table>标签里安装,参数有:
bgcolor 背景颜料
bordercolor 边框颜料
bordercolorlight 几何体边框浅色
bordercolordark 几何体边框暗色
  语法为:<table bgcolor="#RRGGBB">过程RRGGBB团聚为RGB三色的16进制数值
  相似:
<table width=100 border bgColor=#a9d7fb
borderColorDark=#ffffff borderColorLight=#000000 cellPadding=5
cellSpacing=0 bordercolorlight="#000000">
<tr><td bgColor=#FFE084></td>
</tr><tr><td></td></tr></table>


  以上是表格的根本用法。现在frngtpage,dreamweaver等所见即所得的主页编辑软件都不用编写代码,就合格轻松的完成表格的排字和嵌套,但是掌握一些根本语法,关头时间还是很有用处的。
  二.表格运用的注意点
  表格的嵌套并不是表格治理最困难的中央,不论多单纯的版面,悉心琢磨一番总能找出解决的办法。
我们欲望着想的是:
  ○用什么样的嵌套排字方式使主页的下载速度取得最快。
  我们知道:传阅器陪读取主页html原代码时,是读完整一度table再将它显示出来。也就是说从<table>标签开始,要读到</table>标签时,才将表格中的内容显示在银幕上。并且显示也有优先级,先读到的先显示。这样的话,如果一度大表格中含有多个子表格,必须等大表格读完,性格将子表格一起显示出来。
  我们在访问一些站点时,等待多时无原因,按"停止"旋钮却一下显示出页面就是这个原因。
  因此,我们在设计页面表格的时候,应该做到:
  1.整个页面不要都套在一度表格里,过分拆分成多个表格;
  2.单一表格的结构过分整齐;
  3.表格嵌套层次过分要少.
  实验证书:越单纯,嵌套层次越多的表格下载速度越慢。
   对于主页的表格设计今日就写到这里。阿捷没有很多的技巧欲望,关头取决您自己的实践和运用,还是那句古话:“熟能生巧”。

(第一万维网责任编辑:郑朝辉)

本文关键词:网站设计的思考10,网页中表格的运用,建站经验
本文编辑: 万维阳光
最新图片新闻文章
网友正在看下面的相关文章
业界新闻
第一万维网公告
本站最新图片文章
第一万维网QQ客服
为了给您提供更加方便快捷的服务请选
择您的服务专员,点击QQ号码即可。
企业在线客服QQ:800015119
公司简介 | 公司新闻 | 付款方式 | 联系我们 | 有问必答 | 网站备案