CSS sprites technology (sprite)

First, the technical wizard generated background

 

  Figure, when a user visits a Web site, you need to send a request to the server to request the schematic page, each image on the page to go through a request presented to the user.

  However, one glance will often use a lot of the background image as a small modification, when the Web page image too much, the server will accept the request and sent frequently, which will greatly reduce the loading speed of the page. In order to effectively reduce the number of servers to receive and send requests to improve the loading speed of the page, it appeared CSS sprites technique (also known as CSS Sprites, CSS Sprite).

Second, the technical nature of the wizard

  CSS sprites are a way of handling Web page background image. It all scattered a background image of a page involved are concentrated to a large map to go, and then the big picture is applied to the page, so that when the user visits the page, simply send a request to the service, the background image of the page to show all of them. Typically, many small that the background image is referred to FIG large sprite (FIG Sprite), Jingdong site a sprite shown below.

  

Third, the use of technology wizard

  CSS sprites actually integrate some of the background image of a Web page into a large figure (sprite), however, each page element is usually required only a small sprite in view of different positions, in order to pinpoint the sprite a small map, you need to use the CSS background-image, background-repeat and background-position properties background positioning, the most critical is to use the background-position property accurately positioned.

 

  Tips : background image a few cases, there is no need to use wizard technology, the maintenance cost is too high. If the background image is more, we can recommend the use of technology wizard.

Guess you like

Origin www.cnblogs.com/niujifei/p/11227567.html