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
- Saving an Image from URL in PHP
- CSS | Image Gallery
- HTML | DOM Image Object
- How to change color of PNG image using CSS?
- Set the size of background image using CSS ?
- HTML | DOM Image name Property
- CSS | background-image Property
- CSS | border-image Property
- HTML | Mapping Image
- Drop shadow for PNG image using CSS
- How to get the width and height of an image ?
- jQuery | :image Selector
- Resize image proportionally with CSS
- CSS | border-image-outset Property
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.