MEJOR SITIO PARA DESARROLLADORES WEB
HTML CSS JAVASCRIPT SQL PYTHON PHP JAVA KOTLIN GO C C++ C# Django CÓMO W3.CSS AI Más 🔍 ◑ Libros REFERENCIAS EJERCICIOS
HTML5 Lecciones para principiantes

Ua En De

HTML Tamaños de mesa

❮ Prev Next ❯

Las tablas HTML pueden tener diferentes tamaños para cada columna, fila o la tabla completa.

     
     
     
     
     
     
     
     

Utilice el atributo style con el width o height propiedades para especificar el tamaño de una tabla, fila o columna.

HTML Ancho de la tabla

Para establecer el ancho de una tabla, agregue el atributo style al elemento <table>:

Ejemplo

Establezca el ancho de la tabla al 100%:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Inténtalo tú mismo »

Nota: Usar un porcentaje como unidad de tamaño para un ancho significa qué ancho será este elemento en comparación con su elemento principal, que en este caso es <body> elemento.

HTML Ancho de columna de la tabla

     
     
     

Para establecer el tamaño de una columna específica, agregue el atributo style en una <th> o Elemento <td>:

Ejemplo

Establezca el ancho de la primera columna al 70%:

<table style="width:100%">
  <tr>
    <th style="width:70%">Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Inténtalo tú mismo »

HTML Altura de la fila de la mesa

     
     
     

Para establecer la altura de una fila específica, agregue el atributo style en un elemento de fila de la tabla:

Ejemplo

Establezca la altura de la segunda fila en 200 píxeles:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Inténtalo tú mismo »

HTML Ejercicios

Ponte a prueba con ejercicios

Ejercicio:

Utilice estilos CSS para hacer que la tabla tenga 300 píxeles de ancho.

<table >
  <tr>
    <th>First Name</th>
    <th>Last Name</th>
    <th>Points</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
</table>

❮ Prev Next ❯

✍ Comentarios