首页 | 新闻 | 短信 | 邮件 | 商城 | 搜索 | 社区 | 在线 | 企业
搜狐首页 >> IT频道首页 >> 网狐教程 >> 网站制作 >> 其它技巧
如何在网页制作中用好表格
2001-11-12 17:20  转自: 赛迪网

  经常上网的朋友也许会注意到,有些网站的网页中会使用一些特殊的线条来达到美化网页的目的。对许多不熟悉HTML的朋友来说,还以为是使用了CSS、JavaScript等技术,其实不然。看完下面的内容你就会明白了。

  控制表格边框的显示


对使用Dreamweaver、FrontPage等所见即所得的网页编辑软件的朋友来说,很难控制表格的上下左右的边框显示与隐藏,其实你只要在HTML中的〈table〉〈/table〉标签页中添加一项 “frame” 属性即可。

不显示表格边框(frame=void)

只显示表格的上边框(frame=above )

只显示表格的下边框(frame=below )

只显示表格的上下边框(frame=hsides)

只显示表格的左右边框(frame=vsides)

只显示表格的左边框(frame=lhs)

只显示表格的右边框(frame=rhs)

例如,〈table width="75%" border="1" frame=void/above/below/hsides/vsides/lhs/rhs cellpadding="0" cellspacing="0"〉

〈/table〉

控制表格行与列的分割线


在网页设计中,如果版面没设计好,那么这个网页可以说是失败的。利用表格进行分栏,可以达到整齐排版的目的,美化你的网页外观。所谓分栏,就是让你的网页变成一个大表格,然后根据你的版面设计和内容安排,将这个表格分成不同的行和列,调整各个行和列的宽度和高度,以达到你排版的要求。当然了,你还可以在表格之中再嵌套表格,以达到更加复杂的排版需要。在设计过程中你可以灵活设置单元格边距和单元格间距的数值。在HTML语言中表格的分割线是由“rules” 属性来决定的。所以我们可以通过手工修改源代码的方法来控制分割线的显示与隐藏。

1、显示所有分割线(rules=all)

如〈table width="75%" border="1" rules=all cellpadding="0" cellspacing="0"〉

2、不显示任何分割线(rules=none)

3、只显示行与行之间的分割线(rules=rows)

4、只显示列与列之间分割线(rules=cols)

用表格边框实现单线显示


用线条来美化网页是网页设计者经常使用的手法之一。在网页中除了用〈hr〉标记来实现插入水平线外,我们还可以用表格来实现。FrontPage 2000默认的表格线比较粗,但只要稍加处理,就可以制作出一个细线表格,细线表格非常娟秀小巧,很有个性。它的具体操作方法是:在表格属性中将边框粗细设为“1”,将单元格边距和单元格间距设置为“0”,同时将亮边框设置成与表格背景相同的颜色,暗边框设成你想要的任一颜色即可,怎么样,细线表格出现了吧。

〈table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor=#f5c6df frame=below〉 〈tr〉〈td〉& 

〈/td〉〈/tr〉〈/table〉

以上各条技巧都是本人在从事网页设计、学习的过程中积累和借鉴了别人的,希望能对刚从事网页设计的初学者有所帮助,也希望众多的网友能把自己的经验同大家一起分享。

我来说两句 去相关俱乐部 发短信息
     为搜狐IT频道查错 得每日精彩大奖——点击可了解详细信息
搜狐IT频道:体察IT业界动态,传播IT时尚生活——点击进入 >>滚动新闻
相关连接
请发表您的看法
用户: 匿名发出
您要为您所发的言论的后果负责,故请各位遵纪守法并注意语言文明。
留言:
*经营许可证编号:京ICP00000008号
*遵守《互联网电子公告服务管理规定》
*遵守《全国人大常委会关于维护互联网安全的规定》

新闻搜索
关键字:

三重奖励,百分百中奖
·找老乡尽在激情老乡会
·攒魔法袜子拿圣诞礼物
搜狐彩信最新推荐
·[] 眉飞色舞
·[] 厉鬼再现
热门词:必杀功 林忆莲
精彩订阅
新闻资讯
美国正式宣布萨达姆已被捕!
订阅 焦点新闻,了解详情


搜狐商城
·影视|徐静蕾我和爸爸
·音乐|欧美音乐盛典展
·书籍|黑客大曝光
·书籍|1元图书特卖场
·化妆|畅销精品优惠哦
·精品|zippo火机5折起
更多...


网站登录 - 搜狐招聘 - 广告服务 - 联系方式 - 保护隐私权 - 公司介绍
Copyright © 2003 Sohu.com Inc. All rights reserved. 搜狐公司 版权所有