让html的表格中单元格的内容居中显示的方法如下：
1、新建一个html5文件。
2、创建一个宽度为300px，三行四列的表格并写入内容。
3、通过css选择table标签控制表格内容居中，text-align：center；
扩展资料：
<table> 标签定义 HTML 表格。
1、简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。
2、tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。
3、更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Strict//EN"
"http://wwww3org/TR/xhtml1/DTD/xhtml1-strictdtd">
<html xmlns="http://wwww3org/1999/xhtml">
<head>
<title>Lord of Olympia - Zeus</title>
<link rel="stylesheet" type="text/css" href="anotherindexcss" />
</head>
<body>
<ul>
<li><a href="indexhtml">Home</a></li>
</ul>
<div style="text-align:center">
<div style="width:900px; height:600px;border-style:solid;border-color:grey;text-align:center">
<h3>Lord of Olympia - Zeus</h3>
<img src=Zeusgif>
<table border="1",height=150 align="center">
<tr>
<th colspan=3>Basic Attributes</th>
</tr>
<tr>
<th>Health:511</th>
<th>Mana:260</th>
</tr>
<tr>
<th>STR: 19</th>
<th>AGL: 11</th>
<th>INT: 20</th>
</tr>
<tr>
<th>Armor: 2(8%)</th>
<th>APS: 07/s</th>
<th>DPS: 294</th>
</tr>
<tr>
<th colspan=3>Add Attributes</th>
</tr>
<tr>
<th>STR+:18</th>
<th>AGL+:12</th>
<th>INT+:27</th>
<tr>
<th>Att Range: 350(Ranged)</th>
<th>Movespeed: 295</th>
</tr>
<tr>
<th>AttAni:0633/0366s</th>
<th>Cast Ani:04/05s</th>
</tr>
<h3>The legend of Zeus</h3>
<p> Once a deity of unfathomable might, Zeus reluctantly sacrificed in his much relished immortality in exchange for the chance to crusg tge sinister armies of the unholy undead As his soul crossed into the mortal plane, his omnipotent powers withered greatly, yet not nearly enough to quell this destructive Thunder God's resovle for justice With sheer precision, he cleanses through the enemy ranks with an impressive mastery of electrical discharge, smiting the fool hardy with formidable bolts of lightning from the heavens above Ever vigilant in his relentless assault, the Scourge cowers in fear of incurring the fearsome wrath of the Lord of Olympia
</p>
</div>
</div>
</body>
</html>
<table style="width:500px;margin:0 auto">//此处设置居中
</table>
至于实线,table元素设置外层,内层是td设置
1、首先打开vscode编辑器，新建一个html文档，里面写入一个外层的div，再加入一行table表格：
2、然后在上方的style标签中加入css样式，设置table标签的样式，table的元素具有长度自适应性，其长度根据其内文本长度决定，只要设置margin属性，让左右设置为auto就回自动分配剩余空间，也就是元素两侧的区域各占50%，那么元素就左右居中了：
3、最后打开浏览器就可以看到居中的一行表格了：
<style type="text/css"> workorder { background-color:#cff9900; border:1px solid #222222; } body { text-align: center; } div{ margin:0 auto;} </style> <div> <table width="400px" cellpadding="0" cellspacing="0" class="workorder" align="center"> <tr> <td width="50px">类型</td> <td align="center" valign="middle"> <input type="radio" name="jobtype" value="1">投诉 <input type="radio" name="jobtype" value="2">咨询 <input type="radio" name="jobtype" value="3">举报 <input type="radio" name="jobtype" value="4">求助 <input type="radio" name="jobtype" value="5">其他 </td> </tr> </table> </div>
采纳哦
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）