DreamWeaver网页设计培训班经典50问(六)

26. 如何利用水平线制作一条宽度为1的细线？
用水平线法

1.在 Dreamweaver 中新建一个文档，插入一条水平线，双击水平线，调出属性面板。

2.在水平线的属性面板上设置高度 H = 0 pixel。

3.Copy 此条水平线，在属性面板中把 Shade 的勾点掉。

4.按 F12 进行预览，请对比下面的（1）（2）源代码及效果。

(1)

---

源代码：＜hr size="0" color="#3366FF" noshade＞

(2)

---

源代码： ＜hr size="0" color="#3366FF"＞

5.另外制作两条 H = 1 pixels 的水平线，分别有 Shade 和 没 Shade。

(1)

---

源代码：＜hr size="1" color="#3366FF" noshade＞
(2)

---

源代码： ＜hr size="1" color="#3366FF"＞

6.制作两条 H = 2 pixels 的水平线，并定义颜色，分别有 Shade 和 没 Shade。

(1)

---

源代码：＜hr size="2" color="#3366FF" noshade＞
(2)

---

源代码：＜hr size="2" color="#3366FF"＞

7.制作两条 H = 2 pixels 的水平线，颜色为缺省值，分别有 Shade 和 没 Shade。

(1)

---

源代码： ＜hr size="2" noshade＞
(2)

---

源代码： ＜hr size="2"＞

看了上面的几种水平线效果，我们发现，当水平线的高度 H 设为“0 pixel”和“1 pixel”时，无论水平线有没有 Shade (阴影)，它在IE浏览器中都显示为 1 pixel 的细线。在论坛中曾经发现有些网友把高度H设置为小数数值，如：0.1之类的，以求达到 1 pixel 的细线的效果，实质上，在 Dreamweaver 网页编辑器里，属性面板是不能设置小数数值的，但如果我们直接在源代码里输入，属性面板就认了，可以显示出小数数值。同时，IE 浏览器把高度为 2 pixel 以下的水平线识别为 1pixel 。

在制作水平线时我们制作了有 shade 和没有 shade 的，经过对比发现当水平线高度H为 2 pixels 以下时，shade 不起作用，只有到 2 pixels 以上时才看得到 shade 效果。

原文地址：http://www.35ui.cn/post/20100507521.html

标签：静态网页模板制作北京网站制作网络推广外包北京网页设计培训快捷键大全北京网页优化培训网页开发工具

上一条： DreamWeaver网页设计培训班经典50问(五)
下一条： DreamWeaver网页设计培训班经典50问(七)