There are many pictures in png, how to specify which one _html/css_WEB-ITnose

Those small pictures are all on one png picture
For example, what should I do with the picture I want to use in word? What about the chart in excel?

Reply to discussion (solution)

background:url() 0px 0px; The next two values ​​​​are used to position the image. For example, now 0 0 defaults to the picture in the upper left corner, and 100% is the picture in the lower right corner. The order is that the first number is left and right and the last one is up and down.

Set background-position in css
For example, you want the icon to be offset by 300px in the x direction and 20px in the y direction, just like this

background-position: -300px -20px;

CSS magic The technology can meet your requirements, for details, see: http://www.scriptlover.com/static/374-css-sprite

Use clip:rect(top, right, bottom, left)
or background-Position:x y; positioning width,height

background:url() 0px 0px; The following two values ​​​​are used to position the image. For example, now 0 0 defaults to the picture in the upper left corner, and 100% is the picture in the lower right corner. The order is that the first number is left and right and the last one is up and down.

Then I need to open the pictures in photoshop and find out the location of each picture. ​Do you use ps to make png?

CSS magic technology can meet your requirements. For details, see: http://www.scriptlover.com/static/374-css-sprite

The teaching materials with specific examples are all in English. Wow, it seems very laborious to write a long article

background-position: -300px -20px;

background-position: -300px -20px;

Quote Where is that picture written?

Set background-position in css
For example, you want the icon to be offset by 300px in the x direction and 20px in the y direction, just like this
CSS code?1background-position: -300px -20px;

Find a tool that can directly produce css

Css Sprite Tools

http://www.onlinedown.net/soft/100396.htm

Haha Share it

Quoting the reply from luju5 on the 8th floor: background-position: -300px -20px;

Where is the quote of that picture written?

background: url(${contextPath}/skins/default/Waring/round_bg.gif) no-repeat;

url