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="escomad2"><script language='javascript' src='http://www.ordenador.online/ad/es/2.js'></script></div>
</div>
<div class=contentpage>
<div class=p1>Página anterior: <a class='LinkPrevArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-utilizar-JavaScript-para-mostrar-Prime-Factors-.html' >Cómo utilizar JavaScript para mostrar Prime Factors </a> </div>
<div class=p2>Página siguiente: <a class='LinkNextArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cargar-un-DIV-en-Otro-DIV-dinámica-.html' >Cómo cargar un DIV en Otro DIV dinámica </a> </div>
</div>
<dl class=xgc>
<dt><span>JavaScript Programación</span></dt>
<dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-enviar-una-función-JavaScript-en-un-hipervínculo-.html">Cómo enviar una función JavaScript en un hipervínculo </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-invertir-Valor-booleano-en-JavaScript-.html">Cómo invertir Valor booleano en JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-combinar-Javascripts-.html">Cómo combinar Javascripts </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-crear-un-formulario-de-inscripción-para-un-sitio-web-.html">Cómo crear un formulario de inscripción para un sitio web </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-eliminar-una-barra-de-direcciones-en-HTML-.html">Cómo eliminar una barra de direcciones en HTML </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-crear-Java-Script-.html">Cómo crear Java Script </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-detectar-un-navegador-Safari-en-JavaScript-.html">Cómo detectar un navegador Safari en JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-crear-una-Div-como-Scriptaculous-Draggable-.html">Cómo crear una Div como Scriptaculous Draggable </a></dd>
</dl>
</div>
<!--right-->
<div class=rightmain>
<div class=esrightlist>
<div class=e1>Los últimos artículos de equipo</div>
<ul>
<li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-poner-código-JavaScript-en-un-archivo-PHP-.html" >Cómo poner código JavaScript en un archivo PHP </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-subir-películas-Flash-.html" >Cómo subir películas Flash </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-hacer-Pop---Ups-.html" >Cómo hacer Pop - Ups </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Menús-sencillos-Dinámicas-para-un-Sitio-Web-.html" >Menús sencillos Dinámicas para un Sitio Web </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-deshabilitar-ActiveSync-Microsoft-.html" >Cómo deshabilitar ActiveSync Microsoft </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Conjuntos-de-marcos-correctos-JavaScript-.html" >Conjuntos de marcos correctos JavaScript </a> </li>
</ul>
</div>
<div class=esrightlist>
<div class=e1>Artículos de la popular computadora</div>
<ul>
<li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-el-tamaño-y-tipo-de-una-chincheta-en-un-mapa-de-Virtual-Earth-.html" >Cómo cambiar el tamaño y tipo de una chincheta en un mapa de Virtual Earth </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Javascript-Tutorial-Scrollbar-.html" >Javascript Tutorial Scrollbar </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/¿Por-qué-tengo-un-Vacío-Mensaje-Javascript-.html" >¿Por qué tengo un Vacío Mensaje Javascript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-convertir-Javascript-UTC-Fecha-de-hora-del-Este-.html" >Cómo convertir Javascript UTC Fecha de hora del Este </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-incrustar-vídeos-en-un-pop-up-con-JavaScript-.html" >Cómo incrustar vídeos en un pop-up con JavaScript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-agregar-una-barra-de-búsqueda-a-tu-sitio-web-Editorial-.html" >Cómo agregar una barra de búsqueda a tu sitio web Editorial </a></li>
</ul>
</div>
<div class="esrightad">
<script language='javascript' src='http://www.ordenador.online/ad/es/r.js'></script>
</div>
<div class=esrightlist>
<div class=e1>Más categorías</div>
<ul>
<li><a href='http://www.ordenador.online/Programacion/C--C-----Programming/' target="_self">C /C + + Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Lenguajes-De-Programación/' target="_self">Lenguajes De Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Delphi-Programación/' target="_self">Delphi Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-Java/' target="_self">Programación Java</a></li>
<li><a href='http://www.ordenador.online/Programacion/JavaScript-Programación/' target="_self">JavaScript Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-PHP--MySQL/' target="_self">Programación PHP /MySQL</a></li>
<li><a href='http://www.ordenador.online/Programacion/Perl-Programming/' target="_self">Perl Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Python-Programming/' target="_self">Python Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Rubí-Programación/' target="_self">Rubí Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Visual-Basics-Programación/' target="_self">Visual Basics Programación</a></li>
</ul>
</div>
</div>
<!--right end-->
<div class="cl"></div>
</div>
<div class=esfoot>
<div class=copy>Conocimientos Informáticos © http://www.ordenador.online</div>
</div>
</body>
</html> | | 