-
您的位置：首页 → 网页设计 → DreamWeaver → DreamWeaver表格妙用-线框制作详解（一）
DreamWeaver表格妙用-线框制作详解（一）
时间：2004/11/7 2:35:00来源：本站整理作者：蓝点我要评论(0)
-
在DreamWeaver里，表格被更多的应用在布局网页，定位内容上。其实除了这些“大功能”的运用，通过各种变通的方法，表格还能实现很多在设计中一般难以达到的效果，下面将要给大家展示的“线框”制作就是一个很好的例子，当然它的巧妙运用还远不止此。
“线框”对象在网页中是经常见到的，比如一条细线，一个方框等等都在包含之列。在某些效果的协调制作中，“线框”的修饰是必不可少的。然而让我们很遗憾的是，许多主流网页设计工具中都没有提供比较直接简便的线框制作功能。在这种情况下，利用其他元素来间接实现就显得尤为重要了。
1> 跨幅细线的制作
首先，我想大家应该理解下这里“跨幅细线”的概念，而很重要的一点就体现在“细”上，这也是我们要通过表格来实现它的原因所在。
接触过网页设计的网友都知道，在HTML（超文本传输语言）中，有一个
--------------------------------------------------------------------------------
的标记，这个标记是用来制作“水平线”对象的，那么你一定问了，水平线不就是细线么？为什么还要用表格去作它呢？
的确，水平线是用来制作线条的，包括横幅和竖幅的效果，它都可以实现。但以目前的应用来看，水平线根本达到不了我们所要求的细度，也即真正Height=1pixels的效果。
下面是一组通过水平线制作的细线图示：
其中前两个明显看上去要粗糙的多，而后面的已经在属性（Properties）板上手动设定高度为1的显然也不是很符合我们的要求，并且水平线要更改颜色的话，必须到源代码中才可以实现，使用起来不是很方便，明白了上面这些，我们看一下通过表格怎么达到更好的效果。
单击“Object”面板中的“表格”图标或者选择菜单“Insert”-“Table”，在网页中适当的位置插入一个高，宽均为1的表格对象。如图
将Width的显示状态从“Percent”更改为代表实际大小的“Pixels”，这样避免在窗口放缩时引起的错乱，OK，同时在网页编辑窗口中用鼠标选定表格，属性板如下：
这是默认状态下的表格属性设置，将其中的“Border”，“CellPad”，“CellSpace”值全部设定为0。
鼠标在表格内部空点，这时属性板已经自动切换到单元格的属性设置窗口，将单元格的“Bg”设定为“红色”（为最终细线的颜色，可自由设置），同时把“H”设置为“1”，如图
单击编辑窗口左上的“Show code view”按钮进入源代码窗口，将代码 | 之间的“ ”去掉，现在可以看看效果了。
此外，你可以通过调整表格的“Width”值控制细线的长度。类似的方法，还可以制作出竖幅细线。
相关阅读
Windows错误代码大全 Windows错误代码查询激活windows有什么用Mac QQ和Windows QQ聊天记录怎么合并 Mac QQ和Windows QQ聊天记录Windows 10自动更新怎么关闭 如何关闭Windows 10自动更新windows 10 rs4快速预览版17017下载错误问题Win10秋季创意者更新16291更新了什么 win10 16291更新内容windows10秋季创意者更新时间 windows10秋季创意者更新内容kb3150513补丁更新了什么 Windows 10补丁kb3150513是什么
-
热门文章
没有查询到任何记录。
最新文章
CSS优雅的公布栏源码
高级CSS选择器的使用
将网站（主页）变成黑白DW设计网页时组织CSS的建议利用Dreamweaver合理优化网页元素布局22个Dreamweaver内置网页过渡特效简介
人气排行
如何用Dreamweaver制作电子相册下拉菜单全攻略-用Dreamweaver制作下拉菜单用Dreamweaver实现ASP数据库动态网站建设用Dreamweaver CS3制作下拉菜单如何在DW中插入Flash的参数详解Dreamweaver标签选择器的妙用巧用dreamweaver模板批量制作网页优化HTML代码加快网页速度
查看所有0条评论>>