In entrambi JavaScript e HTML , il tag "
" definisce un elemento cella di tabella . Prima di creare un elemento di tabella , creare una tabella con il tag " " e una riga della tabella con il tag "tr " . Allineare orizzontalmente contenuti collegando attributo della "align = ' center' " al tag ( deprecato nella versione HTML 5) o utilizzando i CSS per impostare i margini destro e sinistro per auto e impostando il "text- align: center " attributo per la cellula . Istruzioni
1 Creare un nuovo documento HTML utilizzando il blocco note o un editor HTML . Immettere le intestazioni HTML nel documento : < ! DOCTYPE HTML >
< meta charset = "utf - 8" >
centro cella di tabella < /title> <br> 2 <p> Creare una definizione di stile CSS , che verterà sul contenuto di una cella di tabella da creazione di una classe con i margini destro e sinistro uguali su "auto " e " text-align " impostato su " centro : " <br> <p> <style> <br> <p> ccell { margin-left : . auto , margin-right : auto; text-align : center; } <br> <p> < /style > <br> 3 <p> Creare una funzione JavaScript che otterrà il " id " di una cella della tabella e aggiungere la classe CSS per centrare il contenuto della cella : <br> <p> <script> <br> <p> funzione centerIt ( ) { <br> <p> var c = document.getElementById ( " theCell " ) ; <br> <p> c.className + = " ccell " ; <br> <p> } <br> <p> < /script> <br> <p> < /head> <br> <br> 4 <p> Creare una tabella HTML usando il tag <table> , aggiungere una nuova riga utilizzando la tag <tr> e aggiungere una nuova cella utilizzando il tag <td> . Assegnare lo stesso "id" utilizzato nella funzione JavaScript per la cellula . Chiudere tutti i tre tag : <br> <p> <body> <br> <p> <table width="800" border="1"> <br> <p> <tr> <br> < p > <td id="theCell"> po 'di testo da centrare < /td > <br> <p> < /tr> <br> <p> < /table> <br> < br > 5 <p> Creare un modulo HTML con un pulsante che richiama la funzione JavaScript per centrare orizzontalmente il contenuto della <td> quando si fa clic : <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> Salvare il file HTML . Aprilo con un browser e visualizzare il testo iniziale con allineamento a sinistra della cella di tabella . Fare clic sul pulsante e guardare il testo diventi centrata orizzontalmente . <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='/Programmazione/javascript-programming/90944.html' >Come utilizzare JavaScript per visualizzare Fattori primari </a></li></p></td>
</tr>
<tr>
<td width="49%"> next ： <a class='LinkNextArticle' href='/Programmazione/javascript-programming/90946.html' >Come caricare un DIV in un altro DIV dinamicamente </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"> Articoli Correlati </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="/Programmazione/javascript-programming/90992.html" title="Come fare un DIV Visibile con una pergamena in JavaScript " target="_self">Come fare un DIV Visibile con una pergamena in JavaScri…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91131.html" title="Come aggiungere Galleggiante Con Javascript " target="_self">Come aggiungere Galleggiante Con Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90760.html" title="Java Script Controllo del modulo di immissione di testo per i caratteri speciali " target="_self">Java Script Controllo del modulo di immissione di testo…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91216.html" title="Come cambiare il font Colori Con Javascript " target="_self">Come cambiare il font Colori Con Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90792.html" title="Tutorial per Come installare plugin jQuery " target="_self">Tutorial per Come installare plugin jQuery </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90947.html" title="Come fare un pulsante di download di un file in HTML " target="_self">Come fare un pulsante di download di un file in HTML </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91140.html" title="Come calcolare la risoluzione dello schermo con Java Script " target="_self">Come calcolare la risoluzione dello schermo con Java Sc…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90805.html" title="Come utilizzare il codice DBL " target="_self">Come utilizzare il codice DBL </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90811.html" title="Come disegnare curve con Javascript " target="_self">Come disegnare curve con Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90777.html" title="Come fare un programma per convertire Celsius a Kelvin " target="_self">Come fare un programma per convertire Celsius a Kelvin </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">Articoli in evidenza </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="/Programmazione/python-programming/93631.html" title="Come ottenere la versione di Python installata " target="_self">Come ottenere la versione di Python installata </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/computer-programming-languages/87784.html" title="Come creare colonne nel Listbox C # " target="_self">Come creare colonne nel Listbox C # </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/91487.html" title="Come installare PHP in una cache di Windows " target="_self">Come installare PHP in una cache di Windows </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/94885.html" title="Come utilizzare XML con VB.NET " target="_self">Come utilizzare XML con VB.NET </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90816.html" title="Come utilizzare JQuery per inserire un ancoraggio " target="_self">Come utilizzare JQuery per inserire un ancoraggio </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/92531.html" title="Come includere funzioni PHP da un altro file " target="_self">Come includere funzioni PHP da un altro file </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/92023.html" title="Come catturare tutte le variabili di una funzione SCOPE PHP " target="_self">Come catturare tutte le variabili di una funzione SCOPE…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91234.html" title="Come creare elementi con JavaScript lato client " target="_self">Come creare elementi con JavaScript lato client </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/cc-programming/86159.html" title="Come ordinare un elenco generico " target="_self">Come ordinare un elenco generico </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/94513.html" title="Come utilizzare VB6 per fare booters " target="_self">Come utilizzare VB6 per fare booters </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 © Conoscenza Informatica http://it.wingwit.com
<script language='javascript' src='/ad/201310/1.js'></script></td>
</tr>
</table>
</div>
</body>
</html> | | 