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
- CSS | Image Gallery
- Saving an Image from URL in PHP
- How to Mount an ISO Image?
- How to darken an Image using CSS ?
- Bulma | Image
- CSS | border-image Property
- HTML | DOM Image name Property
- Drop shadow for PNG image using CSS
- Resize image proportionally with CSS
- How to display a PDF as an image in React app using URL?
- How to crop an image using canvas ?
- How to get the width and height of an image ?
- How to flip an image on hover using CSS ?
- How to render HTML to an image ?
- How to Resize JPEG Image in PHP ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. 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.