css3 背景

CSS3背景
  • background-image属性   添加背景图片
    • 可加多张,不同的背景图像和图像用逗号隔开,所有的图片中显示在最顶端的为第一张。 
    • background-image: url(img_flwr.gif), url(paper.gif);
    • 可以给不同的图片设置多个不同的属性
    • background: url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat;
  • background-size 属性  指定背景图像的大小
    • 可以指定像素或百分比大小
    • background-size:100% 100%;
    • background-size: contain;  水平铺满,垂直等比例的放大
    • background-size: cover;    铺满全屏,多余的切掉
  • background-Origin属性   指定了背景图像的位置区域
    • background-Origin: content-box;   填充文本区域
    • background-Origin: padding-box;  填充区域从内边距开始
    • background-Origin: border-box;  填充区域从边框开始
  • background-clip属性  背景剪裁属性是从指定位置开始裁剪
    • background-clip: content-box;   文本区域开始裁剪
    • background-clip: padding-box;  从内边距开始裁剪
    • background-clip: border-box;  从边框开始裁剪
posted @ 2020-08-21 21:47  帅气巴巴  阅读(121)  评论(0编辑  收藏  举报