Maison > interface Web > tutoriel HTML > Le contenu du tableau en HTML est affiché horizontalement et verticalement au centre

Le contenu du tableau en HTML est affiché horizontalement et verticalement au centre

不言
Libérer: 2018-06-05 16:34:35
original
7115 Les gens l'ont consulté

Cet article présente principalement les informations pertinentes sur le centrage horizontal et vertical du contenu des tableaux en HTML. Les amis dans le besoin peuvent se référer à

Spécifiez

#class td /*设置表格文字左右和上下居中对齐*/ 
{  
    vertical-align: middle;
    text-align: center;  
}
/*class 是所属的类*/
<p id="class" align="center" style= "margin: 0cm 0cm 0pt; text-align: left">                                                                      
<table class="table table-bordered" border="1" width="100%" style="font-size: 14pt; color: #000000; font-family: 楷体;mso-ascii-font-family: &#39;times new roman&#39;; mso-hansi-font-family: &#39;times new roman&#39;">                                                             
<caption><h2 style="text-align: left;font-size: 16pt;font-family: 宋体;color: red;">title</h2><
/caption>                                                              
<tbody >                                                                 
<tr style="font-weight: bold;mso-bidi-font-size: 12.0pt;font-family: 宋体;" >                                                                      
<td>序号</td>                                                                      
<td>适用情况</td>                                                                      
 <td>详情</td>                                                                       
<td>备注</td>                                                                   
 </tr>                                                                                                                                       
<tr>                                                                    
<td>1</td>                                                                     
<td>xxxxx</td>                                                                      
<td style="text-align: left;"> <!--指定靠左对齐-->                                                                     
 <span>                                                                             
xxxxxx<br>                                                                                                                                                        
</span>                                                                      
</td>                                                                       
<td><a href="#">查看详情</a>
</td>                                                              
</tr>                                                
</tbody>                                                          
</table> 
</p>
Copier après la connexion

Ce qui précède consiste à spécifier l'identifiant comme classe dans p, puis l'attribut td de table utilise le style spécifié en css, à peu près comme indiqué dans la figure

Le contenu du tableau en HTML est affiché horizontalement et verticalement au centre

Recommandations associées :


Html pour réaliser l'effet de rapport de l'affichage dynamique des blocs de couleur (exemple de code)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal