复合属性背景background
background-color背景颜色
值：颜色名/十六进制#rrggbb(就可以缩写#rgb)/rgb函数/tansparent/inherit
background-image背景图片
值：none/inherit/url（图片路径）
background-repeat背景图片是否重复或者重复方式
值：repeat/repeat-x/repeat-y/no-repeat/inherit
如果存在background-image那么就可能存在background-repeat
如果不再在background-image那么一定就不存在background-repeat
background-attachment背景图片是否随内容的移动而移动
值：scroll/fixed/inherit
background-position
背景图片水平垂直位置
值：位置参数/长度/百分比
background就是五种属性的组合 值：以上5种属性值的集合
ul>li*12：自动生成在ul层级下生成12个li标签
1.background-image详细讲解
<ul >
<li >1<li>
<!-- 黑和白 -->
<li >2<li>
<li >2<li>
<!-- 缩写 -->
<li >2<li>
<li >2<li>
<!-- a表示透明度alpha -->
<li >3<li>
<li >3<li>
<!-- opacity表示标签透明度 -->
<li >3<li>
<!-- transparent 透明色 表示标签默认的背景色 -->
<li>4<li>
<!-- inherit 继承 表示继承父级元素的背景色 -->
<li >4<li>
</ul>
2. background-image和background-repeat
background-image背景图片
值：
none/inherit/url（图片路径）
background-repeat 背景图片是否重复或者重复方式
值：
repeat/repeat-x/repeat-y/no-repeat/inherit
<!-- 背景图填充效果 --->
<div ></div>
<div ></div>
<div ></div>
<div ></div>
<div ></div>
<div ></div>
<div ></div>
<div ></div>
3. background-attachment
背景图片是否随内容的移动而移动
值：scroll/fixed/inherit
<body >
<!-- scroll 默认值 可以滚动 --->
<!-- fixed 固定不动 --->
<!-- inherit 继承父级元素 --->
<div ></div>
</body>
4. background-position
背景图片水平或垂直方向的位置
值：参数/长度/百分比
<!-- 位置参数 background-position: y x; y center/top/bottom x center/left/right --->
<div ></div>
<!-- border 边框 1px边框宽度 solid实线 black颜色 详见边框详解 --->
<!-- 一个值10px x轴偏移10px y轴居中 --->
<!-- x轴向右偏移10px --->
<!-- y轴向下偏移5px --->
<div ></div>
<!-- 一个值50% 上下左右偏移到50% --->
<!-- x轴偏移到50%--->
<!-- y轴偏移到10%--->
<div ></div>
轮播图箭头按钮，是一整张图。悬停，显示其他图片。
<!-- 显示左箭头--->
<div ></div>
<!-- 显示右箭头--->
<div ></div>
轮播图箭头图例：
demo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>
<!-- 掘金色#1e80ff #e8f3ff -->
<div >1</div>
<div >2</div>
<div >3</div>
<div >4</div>
</head>
<body>
</body>
</html>
关于颜色
css规范中定义了147种颜色名，17种标准色，130种其他色。
tan/teal/thistle/tomato/turquoise/ darkmagenta/darkslategray/lightcoral/lightcyan/lightslmon/lightseagreen/ red/darkgoldenrod/darkred/indianred/mediumvioletred/orangered/palevioletred/ gray/darkgray/darkslategray/dimgray/lightslategray/slategray/ black/blanchedalmond/blue/blueviolet/burlywood/aliceblue/cadetblue/darkblue/darkslateblue/ aliceblue/antiquewhite/aqua/aquamarine/azure/beige/bisque/black/blanchedalmond/blue/ solid/saddlebrown/salmon/sandybrown/snow/crimson/darksalmon/gainboro/lightsalmon/mistyrose/rosybrown
作者：林泉
链接：https://juejin.cn/post/7009627877347950623
来源：掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。