La etiqueta figure y la etiqueta figcaption son nuevas etiquetas semánticas en HTML5.
etiqueta de figura, etiqueta semántica html5.Se utiliza para especificar el contenido de la transmisión individual (imágenes, gráficos, fotografías, código, etc.).
etiqueta figcaption, etiqueta semántica html5.Usada junto con la figura, la etiqueta se usa para definir el título del elemento de la figura.
Ventajas de utilizar etiquetas figure y figcaptionCuando los motores de búsqueda busquen figuras, sabrán que aquí se almacenan imágenes, gráficos, fotografías, códigos y otros medios, y no pensarán que aquí se almacenan artículos y otras cosas. Los motores de búsqueda hacen que la búsqueda sea más rápida y cómoda.
Por otro lado, cuando los programadores vean esta etiqueta, sabrán que lo que existe aquí son imágenes y otros medios para facilitar la lectura.
El siguiente diagrama describe brevemente cómo utilizar estas dos etiquetas.
Caso 1:Elemento de figura sin título:
<figura> <img style="margen: 0px; relleno: 0px; contorno: ninguno; altura de línea: 25,2 px; tamaño de fuente: 14 px; ancho: 660 px; desbordamiento: oculto; claro: ambos; familia de fuentes: tahoma , arial, Microsoft YaHei;"><figure> <img <figcaption>VeVb Wulin.com, VeVb Wulin.com es un sitio web nacional de aprendizaje de programación de scripts y recursos de construcción de sitios web profesionales, que proporciona procesamiento por lotes de asp, php, asp.net, javascript, jquery, vbscript, dos y producción de páginas web, programación de redes, construcción de sitios web y otros materiales de programación</figcaption></figure>Caso 3:
Varias imágenes, elemento de figura con el mismo título:
<figure> <img <img <img <figcaption>VeVb Wulin.com, VeVb Wulin.com es un sitio web de aprendizaje de programación de scripts y recursos de construcción de sitios web profesionales nacionales que proporciona asp, php, asp.net, javascript, jquery, vbscript, dos Procesamiento por lotes, producción de páginas web, programación de redes, construcción de sitios web y otros materiales de programación</figcaption></figure>Lo anterior es el contenido completo de este artículo. Espero que sea útil para el estudio de todos. También espero que todos apoyen VeVb Wulin Network.