backgroud 应用

标签：pre   div   资源   style   repeat   自动   实现   position   显示   

一，一个典型的应用，利用小图的自动延伸，实现整个网页背景图，充分节约资源宽带。如：汽车之家的404页背景图就是这样

<div style="height: 3000px; background-repeat: no-repeat;background-image: url(1.jpg);"></div>
<div style="height: 3000px; background-repeat: repeat-x;background-image: url(1.jpg);"></div>
<div style="height: 3000px; background-repeat: repeat-y;background-image: url(1.jpg);"></div>
背景可以是颜色，静态 动态图片

二，另一个经典应用，将网站上用到的大量小logo图片，集成在一张大图上，通过ground-position-x 或y 来显示。这样可以节省网站的请求数。
 　　简写模式：
　　　　background-position: 10px 0; = ground-position-x: 10px;ground-position-y: 0;
　　　　background:.....

backgroud 应用

标签：pre   div   资源   style   repeat   自动   实现   position   显示   

原文地址：https://www.cnblogs.com/alex-hrg/p/9376978.html