-
网页背景的设置方法
作者: zhushican 发布: 2015-05-24 分类: 建站教程 阅读: 次 查看评论
- 长期出售各种高年龄的域名！大量批量供应。
网页背景的设置方法告诉我们如何进行网站建设，网站建设网认为，要做好网站建设，就要重视《网页背景的设置方法》方面的知识，同时很多人想问网站建设的技巧？同信长春网站公司认为，网站价格是根据网站功能决定的！
1、无任何重复的背景
无任何重复的背景可以这样来做，在<head>里面加入
<style type="text/css">
<!--
body {
background-image: url(file:///E|/web/my_web/images/aboutus.jpg);
background-repeat: no-repeat;
}
-->
</style>
这样不管图片多大，都不会重复了。不过这样方式的背景只在网页的左上角。
2、用颜色作为网页背景
如果说图片背景会降低网站打开速度，那么颜色背景就是一个良好的解决方案了。特别对于宽屏来说。淡淡的颜色背景比白色的背景好看多了。颜色背景是最为常用和最为重要的，因为相对于图片背景来说，它有无与伦比的显示速度上的优势。在网页文件中，一般通过＜body＞标签来指定页面的颜色背景，格式是：
＜body bgcolor="color"＞
其中的"color"表示想要放置的颜色，可以用各种不同的颜色表示方法，一般我们用颜色的十六进制表示，如#aeaeae(淡灰色)、#ff0000(红色)等等，此外还可以用百分比值法和整数法，其效果都是一样的。
3、背景定位：background-position
语法：{background-position:数值|top|bottom|left|right|center}
作用：背景定位用于控制背景图片在网页中显示的位置。
说明：参数取值范围
4、条状背景
与沙纹背景不同的是，条状背景只让图片在一个方向上重复排列。
首先用图像处理软件做一个从左到右为蓝白渐变的水平条状图片，其长度与页面的宽度相当。也通过
＜body background="picture"＞
将其设为页面 背景。 这样图片就会在竖直方向排列了。还可以通过在<head>里面加入
<style type="text/css">
<!--
body {
background-image: url(picture);
background-repeat: repeat-x;
}
-->
</style>
来设置，其中picture是图片的路径。
5、沙纹型网页背景
我们在网站制作的时候，如果没有对背景显示方法进行控制，那么当试图把自己的照片作为页面的背景是，却发现浏览器上显示出来的不仅仅是一个照片，而是同一照片在水平和竖直方向上的反复排列。即横排和竖排，因为这个现象，我们可以用一小块图片作为页面背景，让他们铺满整个页面。这样就用不着大图片做背景了，因为大图片做背景，网页打开速度会慢的。 方法是：
＜body background="picture"＞
其中的picture表示背景图片的URL路径。
6、照片背景
把自己或朋友的照片作为页面的背景让大家看到，是有点令人激动的事情，但浏览器对图片的自动重复排列却使这一愿望难以实现。怎么办呢？只有想不到的，没有做不到的，这里我们用上一点简单的CSS。在网页文件的……之间加入下面的CSS语句:
这样，在网页页面中，就可以看到你的照片位于页面的正中间，而且在拉动浏览器窗口的滚动条时，照片仍然位于页面的正中间而不随页面内容一起滚动。如果你觉得照片位于页面的正中间不满意，你也可以随意地调整它在页面中的位置，只需要调整"background-position"的值就可以了。
7、复合背景
如果你在练习上面的“照片背景”时“不小心”也设置了标签里的颜色背景，那么你看到了什么？颜色背景还起作用吗？对，你能看到你的照片浮于你设的颜色背景之上，二者能够同时正常地显示出来。这就是复合背景的魅力，更为吸引人的是，当你所设置的图片背景因为某种不可知的因素而不能正常显示的时候，浏览器能够自动用你所设置的颜色背景取而代之。它的设计方法，就不用我再多说了吧！原创文章，转载请注明出处！标签: 网页背景
- 控制面板
-
- 最近发表
-
- 网站分类
-
- 搜索
-
- 最新留言
-
- 网站收藏
-
- 图标汇集
-
- Tags列表
-
- 友情链接
-
评论列表: