Tanto en JavaScript y HTML, la etiqueta "
" define un elemento de celda de la tabla . Antes de crear un elemento de la tabla , cree una tabla con la etiqueta " " y una fila de la tabla con la etiqueta " " . Alinear el contenido horizontal fijando el atributo "align " centro " = " a la etiqueta (en desuso en la versión HTML 5 ), o mediante el uso de CSS para establecer los márgenes izquierdo y derecho de auto y establecer el "text- align: center " atributo para la célula . Instrucciones
1 Crear un nuevo documento HTML con el Bloc de notas o un editor HTML. Introduzca los encabezados HTML en el documento:
< meta charset = "UTF - 8 ">
Center celda de tabla < /title> <br> 2 <p> Crear una definición de estilo CSS que se centrará el contenido de una celda de tabla la creación de una clase con los márgenes izquierdo y derecho son iguales a " auto" y "text -align " en " el centro : " <br> <p> <style> <br> <p> CCELL { margin-left : . auto ; margin-right : auto; text-align : center; } <br> <p> < /style> <br> 3 <p> Crear una función de JavaScript que hará que el "id" de una celda de la tabla y agregar la clase CSS para centrar los contenidos de las celdas : <br> <p> <script> <br> <p> CenterIt function () { <br> <p> var c = document.getElementById ( " theCell "); <br> <p> c.className + =" CCELL " ; <br> <p> <br> <p> } < /script > <br> <p> < /head> <br> Página 4 <p> Crear una tabla HTML usando la etiqueta <table> , añadir una nueva fila mediante la etiqueta <tr> y añadir una nueva celda usando la etiqueta <td> . Asignar el mismo "id " que se utiliza en la función JavaScript para el celular. Cierre todas las tres etiquetas : <br> <p> <body> <br> <p> <table width="800" border="1"> <br> <p> <tr> <br> < p> <td id="theCell"> Este es un texto que se centra < /td > <br> <p> < /tr > <br> <p> < /table> <br> < br > 5 <p> Crear un formulario HTML con un botón que llama a la función JavaScript para el centro horizontal del contenido de la <td> al hacer clic en : <br> <p> <form name="myForm"> < br > <p> <input type="button" value="Center" onClick="centerIt();"> <br> <p> < /form> <br> <p> < /body> <br> <p> < /html> <br> 6 <p> Guarde el archivo HTML. Abra con un navegador y ver el texto inicial alineado a la izquierda en la celda de tabla . Haz clic en el botón y ver el texto convertido centrado horizontalmente . <br> <br>
<div class=ad2><script language='javascript' src='/ad/201310/4.js'></script></div>
</div>
</td>
</tr>
</table>
<table width="95%" height="1" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#DEE7EE">
<tr>
<td></td>
</tr>
</table>
<table width="100%" height="7" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table width="91%" height="52" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="51%"><p>Previous ： <a class='LinkPrevArticle' href='/Programacion/javascript-programming/90944.html' >Cómo utilizar JavaScript para mostrar Prime Factors </a></li></p></td>
</tr>
<tr>
<td width="49%"> next ： <a class='LinkNextArticle' href='/Programacion/javascript-programming/90946.html' >Cómo cargar un DIV en Otro DIV dinámica </a></li></td>
</tr>
</table></td>
</tr>
</table>
<table width="100%" height="7" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table width="770" height="246" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="375" height="246" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian">
<tr>
<td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE">
<tr>
<td width="4%" height="29"> </td>
<td width="96%" class="lan_lm"> Artículos relacionados </td> </tr>
</table>
<table width="95%" height="209" border="0" align="center" cellpadding="0" cellspacing="4">
<tr>
<td height="201"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91098.html" title="Cómo crear una galería de fotos con Siguiente y Anterior Enlaces y Ampliación de imagen Pop - Ups " target="_self">Cómo crear una galería de fotos con Siguiente y Anter…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91032.html" title="Cómo convertir texto a números enteros en JavaScript " target="_self">Cómo convertir texto a números enteros en JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91121.html" title="Cómo agregar elementos a un cuadro combinado con JavaScript " target="_self">Cómo agregar elementos a un cuadro combinado con JavaS…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90774.html" title="Funciones de devolución de llamada de JavaScript : isFunction " target="_self">Funciones de devolución de llamada de JavaScript : isF…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90870.html" title="Cómo insertar CrawlTrack en WordPress " target="_self">Cómo insertar CrawlTrack en WordPress </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91267.html" title="Cómo crear un formulario de inscripción para un sitio web " target="_self">Cómo crear un formulario de inscripción para un sitio…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91156.html" title="¿Qué es el Kit de herramientas de Adobe ExtendScript " target="_self">¿Qué es el Kit de herramientas de Adobe ExtendScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90953.html" title="Cómo eliminar una matriz asociativa JavaScript " target="_self">Cómo eliminar una matriz asociativa JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91270.html" title="¿Qué hace JavaScript " target="_self">¿Qué hace JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91035.html" title="Cómo invertir Valor booleano en JavaScript " target="_self">Cómo invertir Valor booleano en JavaScript </a></td></tr><tr></tr></table></td>
</tr>
</table></td>
</tr>
</table></td>
<td width="20" valign="top"></td>
<td width="375" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian">
<tr>
<td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE">
<tr>
<td width="4%" height="29"> </td>
<td width="96%" class="lan_lm">Artículos destacados </td> </tr>
</table>
<table width="95%" height="207" border="0" align="center" cellpadding="0" cellspacing="4">
<tr>
<td height="199"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/computer-programming-languages/88568.html" title="Hacer un diagrama de flujo " target="_self">Hacer un diagrama de flujo </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/php-mysql-programming/93185.html" title="Cómo crear una copia de seguridad de una base de datos mediante PHP MyAdmin " target="_self">Cómo crear una copia de seguridad de una base de datos…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/visual-basics-programming/95596.html" title="Cómo utilizar el cuadro de diálogo Agregar formulario de login en Visual Basic 6.0 " target="_self">Cómo utilizar el cuadro de diálogo Agregar formulario…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89613.html" title="Cómo evitar Codificar en Eclipse Proyectos " target="_self">Cómo evitar Codificar en Eclipse Proyectos </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89000.html" title="Java: Vinculación estática " target="_self">Java: Vinculación estática </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/php-mysql-programming/92260.html" title="Cómo actualizar el servidor MySQL " target="_self">Cómo actualizar el servidor MySQL </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89511.html" title="Cómo tomar la entrada en Java utilizando un escáner " target="_self">Cómo tomar la entrada en Java utilizando un escáner </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/cc-programming/85707.html" title="Cómo convertir a Void internacional " target="_self">Cómo convertir a Void internacional </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/computer-programming-languages/86910.html" title="¿Cuáles son las diferencias entre la C -Pascal y C Lengua " target="_self">¿Cuáles son las diferencias entre la C -Pascal y C Le…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/cc-programming/85310.html" title="Después de seleccionar una fecha en el selector de fecha y hora , ¿Cómo controlan el Focus C " target="_self">Después de seleccionar una fecha en el selector de fec…</a></td></tr><tr></tr></table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table width="980" height="8" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table border=0 cellSpacing=0 cellPadding=0 width=980 bgColor=#36506e height=90>
<tr>
<td class=bs height=90 align=middle>Copyright © Conocimientos Informáticos http://ordenador.wingwit.com
<script language='javascript' src='/ad/201310/1.js'></script></td>
</tr>
</table>
</div>
</body>
</html>
| | 