Bootstrap allows us to replace the text with background image for any text element like paragraph element, heading element etc. With the use of .text-hide class, we can replace an element’s content with a background image.
<element class = "text-hide" style = "background-image: url('Specify URL of image here');"> </element>
In the above syntax, the text-hide class is used to first hide the text of the element and a background image is added to the element using the CSS background-image property.
Note: This class also helps in improving the SEO of a website, as using this class we can add images to the website using heading tags, and use of heading tags is found to be good for a Webpage’s SEO.
- How to place the image above the slider in mobile view in bootstrap?
- Bootstrap | figure class with Examples
- Include Bootstrap in AngularJS using ng-bootstrap
- Convert an image into grayscale image using HTML/CSS
- ReactJS | Hot Module Replacement
- How to find the parent class name with known class in jQuery ?
- How to override the CSS properties of a class using another CSS class ?
- Bootstrap 4 | Modal
- Clearfix in Bootstrap
- Bootstrap 4 | Inputs
- Bootstrap 4 | Badges
- Typography in Bootstrap
- Bootstrap 4 | Flex
- Bootstrap 4 | Carousel
- Bootstrap 4 | Utilities
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.