background简写

标签:它的   tor   pre   font   css3   pos   背景颜色   order   方式   

在CSS2.1里,background属性的简写方式包含五种属性值,从CSS3开始,又增加了3个新的属性值,加起来一共8个。

CSS2.1

  • background-color 使用的背景颜色。
  • background-image 使用的背景图像。
  • background-repeat 如何重复背景图像。
  • background-attachment 背景图像是否固定或者随着页面的其余部分滚动。
  • background-position 背景图像的位置。

CSS3

  • background-size 背景图片的尺寸。
  • background-origin 背景图片的定位区域。
  • background-clip 背景的绘制区域。

简写形式

background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [ background-size] [background-origin] [background-clip]; 

需要注意的是里面的/,它和font以及border-radius里简写方式使用的/用法相似。/可以在支持这种写法的浏览器里在background-position后面接着写background-size
除此之外,你也可以增加另外两个描述它的属性值: background-originbackground-clip

示例用法

.example { background: aquamarine url(img.png) no-repeat scroll center center / 50% content-box content-box; }

作者:RunningCoderLee

链接:https://www.jianshu.com/p/fa07c2606380

来源:简书

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

background简写

标签:它的   tor   pre   font   css3   pos   背景颜色   order   方式   

原文地址:https://www.cnblogs.com/hongyumao/p/14235934.html

版权声明:完美者 发表于 2021-01-07 12:27:40。
转载请注明:background简写 | 完美导航

暂无评论

暂无评论...