Propiedad de alineación HTML DOM TableData

La propiedad de alineación HTML DOM TableData se usa para establecer o devolver la alineación horizontal del contenido dentro de la celda de la tabla. No es compatible con HTML5.

Sintaxis:

  • Devuelve la propiedad de alineación .
TableDataobject.align
  • Establece la propiedad de alineación .
TableDataObject.align = "left | right | center | justify | char"

Valores de propiedad:

  • izquierda: establece la alineación a la izquierda de la celda TableData.
  • center : establece la alineación central de la celda TableData. Es el valor predeterminado.
  • right: Establece la alineación a la derecha de la celda TableData.
  • justificar: Estira el texto del párrafo para igualar el ancho de todas las líneas.
  • char: Establece el text-align a un carácter específico.

Valores devueltos: Devuelve un valor de string que representa la alineación del elemento TableData.

Ejemplo 1: El siguiente código HTML devuelve la propiedad de alineación de TableData .  

HTML

<!DOCTYPE html>
<html>
 
<head>
  <style>
    table,
    th,
    td {
      border: 1px solid green;
    }
  </style>
</head>
 
<body style="text-align:center;">
  <center>
  <h1 style="color:green;">
    GeeksforGeeks
  </h1>
 
  <h2>DOM TableData align property</h2>
  <table width="500" border="1">
    <tr>
      <th>NAME</th>
      <th>AGE</th>
      <th>BRANCH</th>
    </tr>
 
    <tr>
      <td align="center">BITTU</td>
      <td align="left">22</td>
      <td align="right">CSE</td>
    </tr>
 
    <tr>
      <td align="center">RAKESH</td>
      <td id="columnID" align="left">25</td>
      <td align="right">EC</td>
    </tr>
  </table>
  <br>
 
  <button onclick="myFunction()">
    Return
  </button>
 
  <p id="paraID"></p>
 
 
 
 
  <script>
    function myFunction() {
      // Accessing Table data
      var x =
        document.getElementById("columnID").align;
      document.getElementById("paraID").innerHTML = x
    }
  </script>
  </center>
</body>
</html>

Producción:             

Ejemplo 2: El siguiente código establece TableData para alinear la propiedad.

HTML

<!DOCTYPE html>
<html>
<head>
  <style>
    table,
    th,
    td {
      border: 1px solid green;
    }
  </style>
</head>
 
<body style="text-align:center;">
  <center>
  <h1 style="color:green;">
    GeeksforGeeks
  </h1>
 
  <h2>DOM TableData align property</h2>
  <table width="500" border="1">
    <tr>
      <th>NAME</th>
      <th>AGE</th>
      <th>BRANCH</th>
    </tr>
    <tr>
      <td align="center">BITTU</td>
      <td align="left">22</td>
      <td align="right">CSE</td>
    </tr>
    <tr>
      <td align="center">RAKESH</td>
      <td id="columnID" align="left">25</td>
      <td align="right">EC</td>
    </tr>
  </table>
  <br>
 
  <button onclick="btnclick()">
    Set
  </button>
 
  <p id="paraID"></p>
 
 
  <script>
    function btnclick() {
      // Accessing Table data
      var x =
        document.getElementById("columnID").align = "right";
      document.getElementById("paraID").innerHTML = x
    }
  </script>
  </center>
</body>
</html>

Producción:           

Navegadores compatibles: los navegadores compatibles con los atributos de alineación HTML DOM TableData se enumeran a continuación:

  • Google Chrome
  • explorador de Internet
  • Firefox
  • Safari
  • Ópera

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 *