上一个讲了背景色怎么写，这次讲了背景图的相关属性。
背景图像
您可以设置一个或多个背景。默认设置为“无”，不显示背景。预设的背景图像放在元素的左上角，垂直和水平重复。
见CodePen上karen (@karen0922)的笔背景图。
背景-重复
设置背景图片是否重复。默认为垂直和水平重复。只有设置了背景图片才有效。
重复
以及垂直和水平重复背景图像(默认值)。
重复-x
仅水平重复背景图像。
重复-y
仅垂直重复背景图像。
不重复
只显示一次背景图像，不重复。
见CodePen上的笔背景——由karen (@karen0922)重复。
背景位置
设置背景图像的起始位置。默认背景图像位于元素的左上角。
您需要为该属性输入两个值(水平偏移值和垂直偏移值)。如果只输入一个值，则为水平偏移值，垂直偏移值的默认值为50%。
关键词
有左、右、上、下、中，两个值的顺序可以颠倒。
值
数字后面是单位。正数、负数和小数点都是可以接受的。
百分比(1~100%)
数字后面是百分比单位(%)。可以接受正数、负数和小数点。
百分比和数值可以混合，但关键字不能混合。※.
如果要指定离每个角的位移，可以写成背景-位置:右20px下20px。※:
见CodePen上karen (@karen0922)的笔背景-位置。
背景快速写作
背景-颜色、背景-图像、背景-重复和背景-位置这四个属性可以直接写在背景中，并且可以随意改变顺序。
见CodePen上karen (@karen0922)的笔背景。
背景尺寸
用于设置背景图片的大小。
自动
默认值是保持背景图片的原始大小。
值
自定义背景图片的大小，用两个数字(图片的宽度和高度)表示，不能为负数。如果只写了一个数字，第二个数字将自动设置为自动。
百分比(1~100%)
自定义背景图像的大小，以两个数字(图像宽度和图像高度)的百分比表示。如果只写了一个，第二个会自动设置成auto的效果，背景图会自动缩放。
封面
当背景图片小于容器时，将背景图片的尺寸放大到容器的尺寸，并将其填满。缺点是如果容器的长宽比与背景图片的长宽比不匹配，背景图片会失真。
包含[/S2/]
当背景图像大于容器时，缩小要在容器中显示的背景图像。
见CodePen上karen (@karen0922)的钢笔背景尺寸。
本文来自投稿，不代表重蔚自留地立场，如若转载，请注明出处https://www.cwhello.com/86116.html
如有侵犯您的合法权益请发邮件951076433@qq.com联系删除
