La etiqueta <figure> en HTML se usa para agregar contenido independiente como ilustraciones, diagramas, fotos o listas de códigos en un documento. Está relacionado con el flujo principal, pero se puede usar en cualquier posición de un documento y la figura va con el flujo del documento y, si se elimina, no debería afectar el flujo del documento. Esta etiqueta es nueva en HTML5.
Sintaxis:
<figure> Image content... </figure>
Atributos: contiene principalmente dos etiquetas que se enumeran a continuación:
- img src : esta etiqueta se usa para agregar una fuente de imagen en el documento.
- figcaption : esta etiqueta se utiliza para establecer el título de la imagen.
Ejemplo:
HTML
<!DOCTYPE html> <html> <body> <h1>GeeksforGeeks</h1> <h2><figure> Tag</h2> <!--HTML figure tag starts here--> <figure> <img src= "https://media.geeksforgeeks.org/wp-content/uploads/geeks-25.png" alt="The Pulpit Rock" width="304" height="228"> <figcaption>Geeks logo</figcaption> </figure> <!--HTML figure tag ends here--> </body> </html>
Producción:
Navegadores compatibles:
- Google cromo 8
- Borde 12
- firefox 4
- explorador de Internet 9
- Safari 5.1
- Ópera 11
Publicación traducida automáticamente
Artículo escrito por Vishal_Khoda y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA