Skip to main content

How do I hide an Image in HTML and CSS?

How to remove photos from a website without changing HTML code only using CSS | How do I hide an element in HTML?

There are so many ways to hide an image on a website. Here we will discuss some simple tricks to hide an image in HTML.

How do you remove an image in HTML?

  1. Open your blog or website HTML code in the HTML editor.
  2. Find the below HTML tag
    <img href="image path" />
    If there are multiple img tags, then select the required one using the image path.
  3. Then remove the selected HTML element.
  4. Save and run the website. The image will be removed.
If you remove the image in HTML, the image will be completly removed from the website.

How do I remove an image from a website using CSS?

We can add CSS to the webpage in 3 ways. Here i will explain 3 ways to remove an image from a website using CSS.

Using Inline CSS
  1. Open your blog or website HTML code in the HTML editor.
  2. Find the below HTML tag
    <img href="image path" />
    and covert to
    <img style="display:none" href="image path" />
    If there are multiple img tags, then select the required one using the image path.
  3. Save and run the website. The image will be removed.
Using Internal CSS
  1. Open your blog or website HTML code in the HTML editor.
  2. Find the below HTML tag
    <img href="image path" />
    and covert to
    <img class="hide-image" href="image path" />

    <style>
    .hide-image
    {
        display:none;
    }
    </style>
    If there are multiple img tags, then select the required one using the image path.
  3. Save and run the website. The image will be removed.
Using External CSS
  1. Open your blog or website HTML code in the HTML editor.
  2. Find the below HTML tag
    <img href="image path" />
    and covert to
    <img class="hide-image" href="image path" />
    If there are multiple img tags, then select the required one using the image path.
  3. Add below CSS
    .hide-image
    {
        display:none;
    }
  4. Save and run the website. The image will be removed.
If you remove the image using CSS, the image will not be completly removed from the website but the image will be hidden from user view.

How do I hide an element in HTML?

In the above example, I have explained that how to hide an img element. You can apply the same logic to hide any element in HTML.

Comments