本文来源:网站建设-网站制作|网络营销专家慧云科技-抢滩登陆2009-11-12 13:57:07
大家在制作网页的时候有没有试过通过插入水平线的方法来分割页面呢?
网站建设以往可能我们插入的横线都是比较粗的水平线,这样在一定的程度上影响了网页的美观,怎么样来制作单行细线呢?下面给大家介绍一下。
单行细线很重要的一点就是体现在细上,这也是要通过表格来实现它的原因所在。接触过网页设计的网友都知道,在HTML中,有一个标记是用来制作水平线对象的。建站新闻那为什么还要用表格来实现它呢?没错,水平线固然可以实现线条的横幅和竖幅效果,但以目前的应用来看,水平线根本达不到大家所要求的细度,也即真正1像素高度的效果。接下来介绍一下单行细线的制作方法。
首先我们来看一下插入水平线的方法。
建站研究在DreamweaverMX中新建立一个空白的HTML网页文档。然后选择菜单栏中的插入HTMLT水平线命令,在文档中插入一条水平线,在编辑窗口下方的属性面板中可以设置水平线的一些属性。水平线:下方的文本框可以为水平线取一个名字,便于区分和后面调用。宽:设置水平线的长度。高:设置水平线的高度,也就是粗细,默认值为1.对齐:设置水平线的对齐方式,可以选择左对齐、居中对齐、和右对齐三项。
需要重点说明的是阴影复选框。阴影指定绘制水平线时否带有阴影。取消选择复选框将使用纯色绘制水平线。在这里我们把水平线的阴影去掉,然后在编辑窗口中可以看到,
网站建设如果去掉了阴影效果,水平线反而不如原来有阴影的时候那么细了,所以插入水平分隔线时,我们通常都使用阴影。
设置水平线的颜色。建站模板首先单击编辑窗口视图工具栏上的拆分按钮,切换到拆分视图。找到控制水平线的代码<hr width="400" size="1">,在其中增加控制其颜色的代码"color=#FF0000"。这样我们就完成了插入水平分隔的细线。值得注意的是,如果大家需要对水平线的更改颜色,就必须到源代码中才可以实现,使用起来非常不方便。下面介绍怎么样通过表格来制作单行细线。
单击常用工具面板中的表格按钮或者说选择菜单栏中的插入表格命令,在网页中适当的位置插入表格命令,
建站方案在网页中适当的位置插入一个行数和列数都是1的表格,将表格宽度的显示状态从百分比变成像素,这样避免在窗口大小改变以后表格位置的错乱。
在网页编辑窗口中用鼠标选定插入好的表格,也可以先将光标置于单元格,然后按Ctrl+A快捷键即可选中整个表格,在编辑窗口下方看到属性面板。这是默认状态下的表格属性设置,
网站建设将其中的表格边框、间距和边距的值都设置为0。网站设计将鼠标的光标移动到表格内,这时属性面板已经自动切换到单元格的属性面板了。在单元格属性面板中将单元格的背景设定为红色,最后细线的颜色可随意设置,同时把单元格的高设置为1.
单击编辑窗口视图工具栏上的拆分按钮,切换到拆分视图。找到控制表格属性代码<td><\td>,将代码之间的空格去掉,然后我们就能够看到单行细线的效果了。
这样单行细线就设置完成了。另外,我们还可以通过调整表格的表格宽度值控制细线的长度。采用类似的方法还可以制作出竖幅细线。具体方法在这里就不详细叙述了。请大家自己试试看吧。