这篇文章给大家介绍的文章内容是关于浅析CSS中background背景的用法,有很好的参考价值,希望可以帮助到有需要的朋友。
background-color
值为颜色值或transparent
二者选其一,默认值是transparent
(透明)。
颜色值可以为16进制颜色码或者RGB颜色值,也可以是英文代码。不建议使用英文代码,不同浏览器对不同颜色代码处理的效果有可能不同。
设置背景颜色作为后备也是很重要的。背景颜色在各处都得到了支持,而背景梯度等更奇异的特性只在较新的浏览器中得到支持,加上背景图像可能由于某种原因无法加载。因此,设置基本的背景颜色和指定这些特性是一个好主意,因此无论如何,元素的内容都是可读的。
background-image
指定显示的背景图片,用url()
设置路径。
默认的图片重复方式为水平垂直皆重复。
background-repeat
指定背景图像如何重复的,默认值是repeat
(一直重复,直到整个元素的背景被填充)
值 | 描述 |
---|---|
no-repeat | 不重复 |
repeat | 垂直和水平都重复 |
repeat-x | X轴方向(水平)重复 |
repeat-y | Y轴方向(垂直)重复 |
background-position
指定定位背景图片的位置,原点为左上角(0,0)。
可输入两个值代表 X 轴和 Y 轴,也可以只输入一个值。
可输入长度值(px等)、相对值(rem等)、百分比、关键字(left
,center
,right
,top
,bottom
)
若只输入一个值,则代表 X 轴的值,Y 轴变成center
值可以混搭,如background-position:9px top;
background-attachment
指定当内容滚动时背景如何滚动。
值 | 描述 |
---|---|
scroll | 默认值。滚动,背景图随着页面的滚动而移动。 |
fixed | 固定,当页面的其余部分滚动时,背景图像不会移动。 |
相关推荐:
以上就是浅析CSS中background背景的用法的详细内容,更多请关注php中文网其它相关文章!
已抢64986个
抢已抢27435个
抢已抢14939个
抢已抢7430个
抢已抢9394个
抢已抢18985个
抢