HTML hidden Attribute

 Night Mode  Light Mode

 

Definition and Usage

The hidden attribute is a global attribute. This attribute is new in HTML5. Means, this attribute does not work in the previous versions of HTML.
It specifies, whether an element should be visible or not.

  • The browser do not display elements, which have the hidden attribute.
  • The hidden attribute can be used to prevent the user to seeing an element, until the login process or selecting the check box etc, has been completed.

Example :

<b hidden>Hidden Text</b>
<b>Visible Text</b>
Result


Visible Text

 

Note : if we try to change the display behavior of the element with the hidden attribute by css, it will be override.
See the below example for understanding.

Example

<b hidden id="a">Hidden Text</b>

<b>Visible Text</b>

<style>
#a {
display: inline;
}
</style>
Result

Visible Text

 
In the above example, CSS display property has been override on the hidden element.

Here are a few tutorials for you to read next:

If you find this tutorial helpful, then please Subscribe to our YouTube Channel for video tutorials, and share this article on social media.

Was this post helpful?

Leave a Comment

Your email address will not be published. Required fields are marked *