El atributo oculto en HTML se usa para definir la visibilidad de los elementos. Contiene un valor booleano. Es un indicador semántico de estado en código HTML. Si se utiliza este atributo, los navegadores no mostrarán elementos que tengan especificado el atributo oculto. El atributo oculto se puede ver usando alguna condición o JavaScript usado para ver el contenido oculto. Este atributo puede ser beneficioso para usar para seguir ocultando el contenido o el elemento para mostrarlo a los usuarios, hasta que se cumpla alguna otra condición, como seleccionar una casilla de verificación, etc.
Sintaxis:
<element hidden>
Nota: este atributo es nuevo en HTML 5.
Etiquetas admitidas: este es un atributo global y se puede usar en cualquier elemento HTML.
Ejemplo 1: este ejemplo simple ilustra cómo ocultar el contenido del usuario mediante el uso del atributo oculto con el elemento <div> en HTML.
HTML
<!DOCTYPE html> <html> <head> <title>hidden attribute</title> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML hidden attribute</h2> <!-- hidden paragraph --> <div hidden> This content will be hidden while displaying the content </div> <h4>A computer science portal for geeks</h4> </body> </html>
Producción:
Atributo oculto de HTML
Ejemplo 2: en este ejemplo, hemos utilizado el atributo oculto que ocultará el contenido mientras lo muestra en el navegador.
HTML
<!DOCTYPE html> <html> <head> <title>HTML hidden attribute</title> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML hidden attribute</h2> <!-- hidden paragraph --> <p hidden> We provide a variety of services for you to learn, thrive and also have fun! </p> <p> Free Tutorials, Millions of Articles, Live, Online and Classroom Courses </p> </body> </html>
Producción:
Atributo oculto de HTML
Navegadores compatibles:
- Google Chrome
- Internet Explorer 11.0 y superior
- Microsoft Edge 12 y superior
- Firefox
- Ópera
- Safari