html - 如何删除表格中行之间的空格?
问题描述
我用表格创建了以下HTML
CSS
站点,我想删除行之间的空格,但我无法删除它。
一开始我认为它是一个边界,但现在我假设它是一个简单的空间。
我试图通过更改填充和边距或折叠边框来删除它,但都没有成功。
我怎样才能删除行之间的空间?
#confirmed{
background-color: #FEC3B3;
display: table;
border-collapse: collapse;
box-sizing: border-box;
text-indent: initial;
border-spacing: 2px;
border-color: #FEC3B3;
}
#hours{
background-color: black;
color: white;
text-align: center;
border-collapse: collapse;
border-color: black;
}
#extra1{
background-color: black;
color: white;
text-align: center;
border-collapse: collapse;
border-color: black;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="./style.css" />
<title> Name </title>
</head>
<body>
<header>
<center>
<table class="table1" align="center">
<tr>
<a href="#"><img src="./images/a.jpg" alt="a"/> </a> </center>
</tr>
<tr id="hours">
<td><h3>48 HOURS ONLY </h3> </td>
</tr>
<tr id="extra1">
<td><h3>EXTRA 15% OFF YOUR NEXT ORDER | CODE : BLACK </h3> </td>
</tr>
<tr id="confirmed">
<th rowspan="2"><img src="./images/bracelate_07.jpg" alt="bracelate_07"/></th>
<td><h1> YOUR ORDER IS CONFIRMED!</h1></td>
</tr>
</center>
</header>
</body>
</html>
解决方案
放
border-collapse: collapse
在表标签上
推荐阅读
- java - WildFly 10 与 WebSphere MQ 9:onMessage MDB 部署错误
- javascript - 使用 async/await 来查找 cors 请求的值?
- javascript - React Application SSO 登录问题
- php - Laravel 在 Ubuntu16.04 上安装得到 http error500
- ios - 从 iOS 中的 HLS 下载特定分辨率
- python - 如何将 .ipynb 文件导入另一个
- php - Laravel - 保存返回 true 但不更新数据库
- javascript - NODE 创建 json 文件并导出到 ftp 服务器位置
- docker - 需要帮助 dockerize apt-cacher-ng 服务
- android - Android Studio 收到支持警告:appcompat-v7:28.0.0