火狐浏览器中table下边框不显示问题

最新推荐文章于 2023-09-04 14:10:15 发布

透心凉℃

最新推荐文章于 2023-09-04 14:10:15 发布

阅读量6.2k

点赞数 3

分类专栏：兼容性问题文章标签： border-collapse:collapse; css兼容性问题

本文链接：https://blog.csdn.net/u012826174/article/details/82965347

版权

本文探讨了火狐浏览器中table边框不显示的问题，原因是`border-collapse: collapse;`属性存在兼容性问题。为解决这个问题，建议避免使用该属性，并细致设置边框样式，以防止双边框叠加。提供了解决方案和完整正常的CSS代码示例。

摘要由CSDN通过智能技术生成

有问题的代码

<html>

<head>
	<meta charset="UTF-8">
	<title>canvas</title>
	<style type="text/css">
		.apply-table {
			width: 100%;
			text-align: center;
			border-collapse: collapse;
		}

		.apply-table th,
		.apply-table td {
			height: 30px;
			font-size: 14px;
			border: #000 1px solid;
			color: #000;
		}

		.apply-table th {
			font-weight: 500;
			background-color: #eee;
		}
	</style>
</head>

<body>
	<table class="apply-table">
		<tbody>
			<tr>
				<th>申请人<br>（户主）</th>
				<td>钟鹏翼</td>
				<th>户口簿<br>编号</th>
				<td colspan="2">QWER666</td>
				<th>联系电话</th>
				<td colspan="2">18888888888</td>
			</tr>
			<tr>
				<th>征收住房<br>所有权人</th>
				<td>钟鹏翼</td>
				<th>住房面积</th>
				<td colspan="2">154.00</td>
				<th>非住房面积</th>
				<td colspan="2">0.00</td>
			</tr>
			<tr>
				<th>集体土地使用<br>证号</th>
				<td>ADDRESS666</td>
				<th>房屋权属<br>证号</th>
				<td colspan="5">ADDRESS666</td>
			</tr>
			<tr>
				<th>房屋产权<br>是否合法</th>
				<td>合法</td>
				<th>是否一户多宅、<br>一宅多户</th>
				<td colspan="2">否</td>
				<th>是否原<br>已安置</th>
				<td colspan="2">未安置</td>
			</tr>
			<tr>
				<th rowspan="11">申<br>请<br>家<br>庭<br>成<br>员<br>信<br>息</th>
				<th>姓名</th>
				<th>性别</th>
				<th colspan="2">与户主关系</th>
				<th colspan="3">身份证号</th>
			</tr>
			<tr>
				<td>钟鹏翼<