viernes, 5 de febrero de 2010

82.- HTML – Tablas – Atributos Celdas: "align"

Así como podemos alinear las tablas, también podemos alinear el contenido de las celdas o las filas. dependiendo de si es un único dato o un texto tendrá un efecto diferente, pero siempre similar en ambos casos.

El atributo que utilizamos para la alineación es “align”, y los posibles valores son los siguientes:

  • left: Alinea los datos a la izquierda. Si es un texto lo justifica a la izquierda.
  • center: Centra los datos. Si es texto lo justifica centrado. Los encabezados de las tablas tienen este valor por defecto.
  • right: Es lo contrario de ‘left’. Alinea los datos a la derecha. Si es un texto lo justifica a la derecha.
  • justify: Justifica el texto a derecha e izquierda .
  • char: Alinea el texto alrededor de un carácter específico. En el caso de que el navegador no soportara alineación alrededor de un carácter, no se especifica el comportamiento.

 

Código de Ejemplo aplicando las características vistas anteriormente (el valor “char” no funciona en todos los navegadores):

<html>
  <head>
    <title>Tabla - Alineacion vertical de celdas</title>
  </head>
  <body>
       <table width="100%" border="1"  bordercolorlight="red" bordercolordark="maroon" >
<tr>
         <th width="20%" >Nombre</th>
         <th width="20%" >Telefono</th>
         <th  width="20%" >Otros</th>
         <th width="20%">Comentarios</th>

      </tr>
      <tr>
         <td  width="20%" align="left">Izquierda</td>
         <td  width="20%" align="right">derecha</td>
         <td  width="20%" align="center">centro</td>
         <td  width="20%" align="justify">texto justificado izq. y derecha</td>

      </tr>
      <tr>
         <td  width="20%" align="left">Izquierda</td>
         <td  width="20%" align="right">derecha</td>
         <td  width="10%" align="center">centro</td>
         <td  width="20%" align="justify">texto justificado izq. y derecha</td>

      </tr>
      <tr>
         <td  width="20%" align="left">Izquierda</td>
         <td  width="20%" align="right">derecha</td>
         <td  width="20%" align="center">centro</td>
         <td  width="20%" align="justify">texto justificado izq. y derecha</td>

      </tr>
   </table>
  </body>
</html>

Representación del código en el explorador.

Nombre Telefono Otros Comentarios
Izquierda derecha centro texto justificado izq. y derecha
Izquierda derecha centro texto justificado izq. y derecha
Izquierda derecha centro texto justificado izq. y derecha

Temas anteriores de curso HTML gratis
81.-
80.- HTML - Tablas-Celdas-Alineación Vertical "valign"
79.- HTML - Tablas - Formato de celdas
78.- HTML - Tablas, personalización de las celdas
mas ... acceder al índice de temas ...

Otros Links:
Piso en Garrucha - Almería € 110.000
Ático en Vera Playa - Almería € 303.500
Ático en Vera Playa - Almería € 300 (Alq.Anual)