It is basically an image which is a collection of different images put together to form a single image. The use of image sprites is done for two main reasons:
- For faster page loading since use only single image.
- It reduce the bandwidth used to load multiple images. This way less data is consume.
Image sprites are generally used for designing a graphic social media bar or a navigation bar to make it more attractive and efficient at the same time. It is just a method in HTML and CSS to implement more efficient way of putting images and designing web pages.
- Convert an image into grayscale image using HTML/CSS
- How to hide “Image not found” icon when source image is not found?
- ES6 | Image Map
- How to Mount an ISO Image?
- Bulma | Image
- CSS | Image Gallery
- Saving an Image from URL in PHP
- How to darken an Image using CSS ?
- Resize image proportionally with CSS
- Drop shadow for PNG image using CSS
- How to get the width and height of an image ?
- CSS | border-image Property
- CSS | background-image Property
- How to Create a Tab Image Gallery ?
- How to Generate Captcha Image in PHP ?
- CSS | image-rendering Property
- jQuery | :image Selector
- Set the size of background image using CSS ?
- HTML | DOM Image Object
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.