CSS 背景属性background简写攻略: 您所在的位置:网站首页 html的含义及英文缩写怎么写 CSS 背景属性background简写攻略:

CSS 背景属性background简写攻略:

2024-05-31 09:52| 来源: 网络整理| 查看: 265

常用的6个属性:

background-color 背景颜色: 合法的颜色值 background-image 背景图像: url( ) background-repeat 如何重复背景图像: no-repeat,repeat,repeat-x,repeat-y background-attachment 背景图像是否固定或者随着页面的其余部分滚动:fixed,scroll background-position 背景图像的位置:(left center right) (top center bottom)/x% y%/ xpx ypx background-size 背景图片的尺寸:cover(图片依靠长边缩放),contain(图像依靠短边缩放)/x% y%/xpx ypx

不常用的2个属性: background-origin 背景图片的定位区域:border-box/padding-box/content-box background-clip 背景的绘制区域。border-box/padding-box/content-box

简写形式: background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [ background-size] [background-origin] [background-clip];

如果background-position和background-size同时设置,需要在background-size前面加“/”,类似的简写语法在font和border-radius中也有。 注意:如果简写形式中含有background-size属性,那么必须同时写上background-position属性,如果省略了就会导致样式失效。 总结就是:size和position属性在简写的情况下,要么都写,要么都不写。都写的时候size前面需要加/

示例 div{ width:300px; height:300px; border: 6px dashed #f9f; background: #666 url(../mm.png) no-repeat fixed left top/contain content-box content-box; }

示例图



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有