HTML CSS 背景图像代码:background-image
body {
background-image: url("img.gif");
}
p {
background-image: url("paper.gif");
}
默认情况下,background-image 属性在水平和垂直方向上都重复图像。某些图像应只适合水平或垂直方向上重复,否则它们看起来会很奇怪。如果图像仅在水平方向重复 (background-repeat: repeat-x;),则背景看起来会更好,代码如下:
body {
background-image: url("img.gif");
background-repeat: repeat-x;
}
background-repeat 属性也可以设置不重复,只显示一次,代码如下:
body {
background-image: url("img.gif");
background-repeat: no-repeat;
}
background-position 属性可以设置图片的位置,代码如下:
body {
background-image: url("img.gif");
background-repeat: no-repeat;
background-position: right top;
}
background-attachment 属性设置背景图片是否在浏览器固定位置,还是在网页固定位置,代码如下:
/* 在浏览器固定位置 */
body {
background-image: url("tree.png");
background-repeat: no-repeat;
background-position: right top;
background-attachment: fixed;
}
/* 在网页固定位置 */
body {
background-image: url("tree.png");
background-repeat: no-repeat;
background-position: right top;
background-attachment: scroll;
}
如果你发现错误或有其他见解,请给www.zhuei.com留言,我们会尽快更新本文!