Etiqueta HTML <título>

La etiqueta de título se utiliza para especificar el título de una tabla. Esta etiqueta se insertará justo después de la etiqueta <table>. Solo se puede especificar un título para una tabla. Por defecto está alineado al centro.
 

Sintaxis:

<caption align = "value" ></caption>

Atributos: esta etiqueta acepta un solo atributo como se mencionó anteriormente y se describe a continuación.

Los siguientes ejemplos ilustran la etiqueta <caption> en HTML:

Ejemplo 1: Agregar un título a la tabla, es decir, por defecto alineado al centro. 

html

<!DOCTYPE html>
<html>
<body>
    <h1>GeeksForGeeks</h1>
    <h2>HTML <Caption> Tag</h2>
     
    <table>
        <!-- Adding caption to the table -->
        <caption>Students</caption>
        <tr>
            <th>Firstname</th>
            <th>Lastname</th>
            <th>Age</th>
        </tr>
        <tr>
            <td>Priya</td>
            <td>Sharma</td>
            <td>24</td>
        </tr>
        <tr>
            <td>Arun</td>
            <td>Singh</td>
            <td>32</td>
        </tr>
        <tr>
            <td>Sam</td>
            <td>Watson</td>
            <td>41</td>
        </tr>
    </table>
</body>
</html>

Producción: 

Ejemplo 2: agregar un título a la tabla y agregarle un atributo de alineación para alinear el título a la izquierda.

html

<!DOCTYPE html>
<html>
  <body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML <Caption> Tag</h2>
 
    <table>
      <!-- Adding a caption to the table
            and aligning it to the left-->
      <caption style="text-align: left">
        Students
      </caption>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
      </tr>
      <tr>
        <td>Priya</td>
        <td>Sharma</td>
        <td>24</td>
      </tr>
      <tr>
        <td>Arun</td>
        <td>Singh</td>
        <td>32</td>
      </tr>
      <tr>
        <td>Sam</td>
        <td>Watson</td>
        <td>41</td>
      </tr>
    </table>
  </body>
</html>

Producción: 

Navegadores compatibles: 

  • Google Chrome
  • Borde 12 y superior
  • explorador de Internet
  • Firefox 1 y superior
  • Ópera
  • Safari

Publicación traducida automáticamente

Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *