Html中的背景样式相关

设置背景图片大小 no-repeat 不进行平铺时网页有空白，则使用backgroung-size直接设置宽高值（有两种参数类型：像素【】、百分比（相对于当前元素定位的百分比设置，但要注意body预设是跟随内容，那么此时百分比也是跟随内容，body的高度直接跟随内容高度，解决办法：a.换一个标签 b.将html的高度设置为100%，即是将浏览器的视口设置为html高度 c.将body内部的div设置宽高及backgroung-size）?a,b的bgsize在哪？

background-repeat:默认repeat，可以设置no-repeat

background-size

• contain 缩小至图片刚好显示
• cover 放大至容器被覆盖
• 直接设置宽高值 先宽后高
• 直接设置百分比100%  拉伸填满容器

background-position

• 可以接受4个参数：定位符（top center right left bottom）偏移量 定位符 偏移量
• eg：基于向右（从左到右）偏移80个像素，向下偏移90个像素  left（距离左方） 80（距离上方） top 90
• 可以接受3个参数：定位符（top center right left bottom）偏移量 定位符；定位符（top center right left bottom）偏移量 定位符。缺少哪个定位符后的偏移量，则该偏移量默认为0px。
• eg：紧贴着右边，向下100px：right top 100px
• eg：紧贴着底边，向右100px：left 100px bottom
• 可以接受2个参数：(left)偏移量 (right)偏移量；定位符 定位符  默认偏移量为0px，也可以使用center
• eg：两个偏移量默认从div左上角作为基点，第一个参数控制水平从左向右方向移动，第二个参数控制从上往下方向移动
• 可以接受1个参数：默认控制水平方向，垂直方向默认为center

 background-origin

• padding-box (默认) 图片是从边框内的左上角作为原点进行的背景图片显示
• border-box 图片是从边框外的左上角作为原点进行的背景图片显示
• content-box 是从文本显示区域的左上角作为原点进行图片展示

background-attachment 

• fixed 相对于视口滚动，图片位置会基于我们已经设置好的position参数，基于视口（浏览器窗口）进行重新定位，并保持在当前位置
• scroll 背景图像跟随对象滚动，即容器不动我不动

background 背景简写

• 背景颜色 图片平铺 图片

完美嵌入图片：

将图片放入容器，之后将容器背景色设置为和图片一样的背景色