🥇 ▷ Aprendiendo HTML Parte 25: Uso de los atributos de ancho y alto en tablas HTML

Para aquellos de ustedes que han leído material de aprendizaje de HTML anteriormente, por supuesto que ya están familiarizados con los atributos de ancho y alto.

La aplicación de estos dos atributos no solo se limita a las tablas HTML, sino que también se utiliza para establecer el tamaño del contenido en HTML, como las imágenes.

Para aquellos de ustedes que todavía no entienden cómo crear tablas en HTML y los atributos que se usan comúnmente en las tablas HTML, pueden echar un vistazo a los artículos anteriores para aumentar su comprensión antes de continuar con este artículo.

En general, la aplicación de los atributos de ancho y alto a la etiqueta

solo es compatible con HTML4.01 pero no con HTML5. Sin embargo, también debe saber cómo usar estos dos atributos en la etiqueta

como una lección. Bueno, para más detalles sobre cómo usar estos dos atributos, veamos la explicación a continuación.

Ancho .Atributo

El atributo de ancho en la tabla se usa para especificar el ancho de la tabla. Si no establece el ancho de la tabla con el atributo de ancho, el ancho de la tabla coincidirá con el ancho requerido para mostrar los datos. La sintaxis del atributo ancho es:

<table width="pixel atau %">

En el atributo ancho hay dos valores que se pueden aplicar, a saber:

Marcos	Función
píxeles (px)	Establezca el ancho en píxeles, por ejemplo: 400px o 400 solamente
porcentaje (%)	Establece el ancho en porcentaje de los elementos circundantes, por ejemplo: 30%

El siguiente es un ejemplo de cómo escribir código y usar el atributo de ancho en HTML:

<!DOCTYPE html>
<html>
 <head>
  <title>Penggunaan Atribut Width di HTML</title>
 </head>
 <body>
  <table width="400" border="2">
   <tr>
    <th width="50">No</th>
    <th>NIM</th>
    <th>Nama</th>
   </tr>
   <tr>
    <td align="center">1</td>
    <td>071401001</td>
    <td>Ridayanti</td>
   </tr>
   <tr>
    <td align="center">2</td>
    <td>071401002</td>
    <td>Ahmad Zulham</td>
   </tr>
   <tr>
    <td align="center">3</td>
    <td>071401003</td>
    <td>Zulaikha</td>
   </tr>
  </table>
 </body>
</html>

Después de ejecutar el código anterior en el navegador, aparecerá como se muestra a continuación:

ancho en la mesa

Atributo de altura

El atributo de altura en la tabla se utiliza para determinar la altura de la tabla. Al igual que con el atributo de ancho, si no establece la altura de la tabla con el atributo de altura, la altura de la tabla coincidirá con la altura requerida para mostrar los datos. La sintaxis del atributo de altura es:

<table height="pixel atau %">

En el atributo altura hay dos valores que se pueden aplicar, a saber:

Marcos	Función
píxeles (px)	Establezca el ancho en píxeles, por ejemplo: 150px o 150 solamente
porcentaje (%)	Establece el ancho en porcentaje de los elementos circundantes, por ejemplo: 10%

El siguiente es un ejemplo de cómo escribir código y usar el atributo de altura en HTML:

<!DOCTYPE html>
<html>
 <head>
  <title>Penggunaan Atribut Height di HTML</title>
 </head>
 <body>
  <table border="2" height="150">
   <tr>
    <th width="50">No</th>
    <th>NIM</th>
   <th>Nama</th>
  </tr>
  <tr>
   <td align="center">1</td>
   <td>071401001</td>
   <td>Ridayanti</td>
  </tr>
  <tr>
   <td align="center">2</td>
   <td>071401002</td>
   <td>Ahmad Zulham</td>
  </tr>
  <tr>
   <td align="center">3</td>
   <td>071401003</td>
  <td>Zulaikha</td>
  </tr>
 </table>
 </body>
</html>

Después de ejecutar el código anterior en el navegador, aparecerá como se muestra a continuación:

altura en la mesa

Dado que estos dos atributos no son compatibles con HTML5, se recomienda que utilice CSS para configurar el ancho y el alto de la tabla. La sintaxis de ancho y alto en CSS es:

<table style="width:400px; height:150px;">

Ese es todo el material para usar los atributos de ancho y alto en tablas en HTML, espero que pueda entender bien el material anterior.

Tabla de Contenido