浅谈网页设计中的表格线

《浅谈网页设计中的表格线》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、浅谈网页设计中的表格线明光市职业高级屮学曹克柱从事网页设计、网页教学的人员没有对表格不重视的，尤其是表格线。笔者从事网页设计教学多年，对表格的认识从无到有，从“傻傻的”（是不是应该用“傻瓜式”來形容更好一些？）双线表格，到简单的粗线表格，再到各种精巧的细线表格，花费了大量的时间，对表格的研究至今也只能算是略窥门径，在这里拿出来与广大网页设计爱好者（当然更多的是与广大网页设计初学者）分享。记得第一次使用表格时，使用的是表格默认的参数，做出來是这样的表格：当时觉得挺好看的，还双线呢！在Word中就没见过，后来上网看别人做的网站，竟没

2、有一个网站上的表格用双线的，直到后来欣赏过无数的网站后，才觉得当时的表格真的有种“傻傻的”感觉。其实表格的功能是强大的，深入研究后，才发现原来表格可以这么做！一、简单粗线表格其实只要在表格属性面板中将“间距”设为0,即可:产

3、農18Idff3

4、XS38]fBMWE対齐Ji中対齐v'AC)5E—i■愛oJpWWW畑R®pe匚iii42厶中“品五rlJl-1」但是这种表格线也是不常用的O由“间距”设为0,才想到原来网页屮的表格与WORD屮确实不一样（当然表面看是的，本质上是一样的），表格中的线都是双线的，上瓯的粗线只不过是两条表格线

5、合并成一条而已。那么在网页设计中表格的宽度与高度的计算就要考虑双线的问题了，对于设计粗略表格（如手工拖动）一般不考虑，一旦设计精确控制表格就要考虑了，否则，并排放置的两个表格，一个比另一个高了2、3个点，就很难看了。二、细线表格网上流行的表格一般是细线的，比较好看，木人研究多年，只发现了以下儿种：1、使用“Style”参数：DrMMavMMVwrCS3—(D:IrtMtwvr<><»fHta1(XHTBI.>•]文样a》swqp・口qp审的❻）▼筑入MW祁■袁・溯据Spry5OT0G3县

6、

7、田曰®）0■D衣格域htmle<1>45620212224266ktalPUBtlciJ-//W3C//DtDXHTMLUntitledDocumentr•nb&p:

8、!•tdAnbsp:/tdtdAnbxpAnbxpZtd>/td>.td昭O.C3宀•克楡■页flb1.0TrxonalZ/^N**htrp://vw.w3.org/fR/xhtml1/DTD/xhtMll-tranaxtIona*>text/html.char»et«■>lx«n=*c«xvter*cellspacxr»g=*0*border-coll

9、Apse:collapse*>效果如下：这也是当前比较流行的一种。2、利用“间距”作为表格线:原理：表格线宽设为0,“间距”设为1（当然如果想制作线宽任意的表格线，可设置其他值），表格背景颜色设为蓝色（注意：这就是表格线的颜色），单元格背景颜色设为口色（这个将显示为表格背景颜色）。参数如下:

10、lorn^fFFFFFF*Anbsp：inbsp:inbsp;Anbsp;inbsp; ：4n

11、bsp;这里为了节省版面，用的是代码视图，用设计视图也是很容易做到的。3、将双线的其中一条设为背景色（如白色）：设计与效果图如下：（菜单调用：修改I编辑标签）常规标签编辑器一tabletable-浏览器特定的浏览器特定的样式表