您好,欢迎来到素彩网!

DreamWeaver表格妙用-线框打造详解(二)

来源:sc115.com | 266 次浏览 | 2011-06-29

标签: Dreamweaver DreamWeaver表格妙用 线框制作详解 Dreamweaver教程

2>细线边框的制作


细线边框是网页中定位区分内容常用的一种方法,配合特定图片的使用,往往能够达到不错的效果,那么如何制作细线边框呢?


大家都知道,所谓细线边框,大体外观上就是一个简单的1行1列表格,那么我们直接把表格对象的Border值设定为1不就可以了吗?请看下面的制作效果:


同样在网页中指定位置插入一个单行单列的表格,用鼠标单击表格外框的任何一个部位以选中它,在属性板中将“Border”值设定为1,也可以同时将另外的“CellPad”和“CellSpace”置零,如图:



预览状态下的不同效果图示:




从上面的图示中,不难看出简单的边框置1达不到效果,下面我们看下,如何通过对表格的“巧妙”设置来实现要求的细度。


同样在上面的表格中,将属性板中,“border”、“cellpad”设置为“0”,“cellspace”设置为“1”,注意“Cellspace”指的是单元格与单元格之间的距离大小。如图



将表格的“Bgcolor”设定为“红色”,同时将单元格的“Bgcolor”设定为同网页背景色-“白色”,预览效果如图:



为了便于大家理解,这里笔者再稍微解释下。其中我们将“CellSpace”设定为1,在设定表格的背景颜色时,无疑已经包括了这一部分。而后面的单元格设定则恰好把它“甩”下了。这样就促成了显示上的效果,那么改变表格背景色也就是改变边框的颜色了。

搜索: Dreamweaver DreamWeaver表格妙用 线框制作详解 Dreamweaver教程 

最热-Dreamweaver综合教程

层的应用及其定位(三)

驯服不听话的网页表格

在使用Dreamweaver打造主页的时候往往需要改变表格的高度。然而

接触Dreamweaver 4的Flash按钮打造

Dreamweaver快速编辑网页标签

怎样设计首页?(解答)

网页布局设计基础

打造网页十大诀窍

网页上的视觉传达与艺术表现

打造主页的独门功夫五十招

相对路径和绝对路径在网页中的用途

一些与网页密切相关的技术

打造个人主页有诀窍

素材
多种冰激凌和蛋糕PNG图标多种冰激凌和蛋糕PNG图标
精美蔬菜高清图片4精美蔬菜高清图片4
精美蔬菜高清图片2精美蔬菜高清图片2
精美蔬菜高清图片3精美蔬菜高清图片3
精美蔬菜高清图片1精美蔬菜高清图片1
景观效果图素材景观效果图素材
景观效果图素材景观效果图素材
手机高清图片手机高清图片
景观效果图素材景观效果图素材