欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

background 背景图片 --css3

程序员文章站 2023-02-01 23:53:29
background 1.设置背景平铺background-repeat round :图片会进行缩放后平铺space : 图片会进行平铺,中间留下空白空间 注:当滚动行为设为fixed,round和space没有效果 2.设置滚动时的行为background-attachmentscroll:父元 ......
background
1.设置背景平铺
background-repeat
round :图片会进行缩放后平铺
space : 图片会进行平铺,中间留下空白空间
注:当滚动行为设为fixed,round和space没有效果
2.设置滚动时的行为
background-attachment
scroll:父元素滚动时,跟随滚动;子元素滚动时,不跟随滚动。背景图片跟随父元素滚动
local:父元素滚动时,跟随滚动;子元素滚动时,跟随滚动。背景图片一直跟随滚动
fixed:父元素滚动时,不跟随滚动;子元素滚动时,不跟随滚动。背景图片固定不变
3.设置图片尺寸
background-size:宽度,高度
值/auto
如果设置成百分比的话,就是参照父容器的宽度和高度来
contains :会按比例变换大小,使图片全部在容器内,同时自适应容器大小
  如果图片大于容器,会造成空白
  如果图片小于容器 会放大图片
cover 背景图片会按比列缩放或扩大,会使图片充满容器