最新更新 sitemap 设计搜素
网页设计
国外网站 韩国网站 个人主页 手提袋设计 CSS 网页特效 平面设计 网站设计 Flash CMS技巧 服装网站 php教程 photoshop 画册 服务器选用 数据库 Office
网上家居 虚拟主机 域名注册 云主机 网页设计 客服QQ:8208442

CSS中级指南-背景图片

日期:09-03    来源:HTMLDog|    作者:HTMLDog

有很多属性跟背景图片的操作相关。

十分好彩,background的属性可以全部处理它们。

body { background: white url
(http://www.htmldog.com/images/bg.gif) no-repeat top right;
}

这是如下属性的组合:

  • background-color,在前面我们已经说过了。
  • background-image,图片的存储位置。
  • background-repeat,图片如何平铺。可以是 repeat(将会平铺整个页面),repeat-y(在y轴上平铺,上下)repeat-x (在x轴上平铺,左右),或者no-repeat(图片不重复)。
  • background-position,可以是topcenterbottomleftright或者像上面的任意组合。

背景图片可以用在绝大部分的HTML元素上而不仅仅是整个页面(body)。简单使用但可以获得良好效果,比如角落的阴影。

注意

很容易对背景图片失去控制和把你的网页涂得到处都是。一些明显活跃过度的人可能认为在一个页面的背景铺上一个色彩鲜明的图片看起来会很酷,然而却给用户判读前景文本带来识别一个Ж面的挑战。这是一个极端的例子。实践中,用户界面友好的可读文本是在白色朴素的背景上黑色或者在黑色朴素的背景上的白色(当然还有一个建议:米黄色的背景或浅灰色背景会更好,因为会减少刺眼的光)。

所以,最佳地使用背景是用在无内容在上的地方,或者使背景图片比较淡,这也可以减少图片文件的容量,因为没有更多涉及更多的颜色(假设你是使用索引颜色的格式,比如GIF)。