咨询热线
400-0596-872
总部地址
杭州 · 城西银泰 · C座19楼
课程分类
扫一扫 预约体验课
小码王公众号预约
小码王公众号预约
html表格居中代码效果
发布日期：2023-11-02 来源：小码王编程 查看人数： 7
导读：日常在做html表格时会使用到table表格，比如有成绩表、值日表、学员信息表等，会有排版需求让文字居中，合并单元格目录1table边框样式实线虚线2table...
日常在做html表格时会使用到table表格，比如有成绩表、值日表、学员信息表等，会有排版需求让文字居中，合并单元格
table边框样式实线虚线
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>通高科技</title>
<style>
table{
width: 500px;
border: 1px solid red;
}
th,tr,td{
border: 1px dashed red;
}
td{
text-align :center;
}
</style>
</head>
<body>
<table >
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td colspan="3">table边框样式实线虚线</td>
</tr>
</table>
</body>
</html>
table边框颜色样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>通高科技</title>
<style>
table{
width: 500px;
border-color: aqua;
}
td{
text-align :center;
}
</style>
</head>
<body>
<table border="1" >
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td colspan="3">table边框颜色</td>
</tr>
</table>
</body>
</html>
html表格代码
1、首先新建一个html，点击中间，先填入表格内容；
2、style样式控制，设置高度颜色等
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>通高科技</title>
<style>
table{
width: 500px;
border-collapse : collapse;
}
td{
text-align :center;
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td colspan="3">456</td>
</tr>
</table>
</body>
</html>
你也想0元试听小码王少儿编程课程吗？
填写信息免费预约
填写信息免费预约
免责说明：以上展示内容源于网络、合作媒体和网友提供，转载请说明出处。我们对站内所有内容、观点保持中立，如您发现该内容有任何违法/侵权信息，请及时联系我们处理！
本文标题：html表格居中代码效果，本文链接： http://www.xiaomawang.vip/help/20955.html
免费预约
微信扫一扫，预约免费体验课关注微信公众号，在线咨询体验课！
微信扫一扫咨询
公众号在线咨询
