背景属性样式

背景属性

属性名称 中文注释 备注
background-image 背景图片 url(img-path)
background-color 背景颜色
background-attachment 设置背景固定 scroll默认值,随盒子滚动, fixed固定,脱离标准流,固定在浏览器窗口,当背景图片不在盒子的显示范围之内,图片将不会展示
background-repeat 背景平铺 repeat-x横向平铺, repeat-y纵向平铺, no-repeat不平铺
background-position 设置背景图片的位置 第一个值是水平位置,第二个值是垂直的位置,起点0 0是图片与容器左上角对齐(注意:这是背景图片没有被设置成fixed的情况,设置成fixed则会相对于整个页面窗口设置位置)
background-size 设置背景图片大小 - 两个值宽,高,设置这个可能会导致图片失真
- cover图片等比例放大,全部覆盖容器,但是图片超过的部分不显示
- contain图片等比例放大,尽量覆盖容器,但是不会以图片失真为代价覆盖整个容器,所以可能会有部分地区不能完全覆盖
background 背景缩写 可以合并background-colorbackground-imagebackground-repeatbackground-positionbackground-attachment,没有固定的顺序,任何属性都能省略,但是省略会覆盖你前面这些属性设置的值,不能合并background-size

你可能感兴趣的:(CSS,css)