我在第一张表后面添加了一个跨度,但它没有按照我的预期工作,表和跨度之间存在间隙,并且跨度宽度也不符合第一个表的宽度
这是跨度的css:
.tieudecuoi
{
line-height:24px;
background-color: #80A5CE;
text-transform: uppercase;
color: #FFF;
font-weight: bold;
font-size: 12px;
margin-top: 0;
margin-bottom: 0;
padding-top:0px;
padding-bottom: 0;
width:300px !important;
}
答案 0 :(得分:1)
它对我有用,就像我在评论中提到的那样,但我只是在Chrome中测试过它......
编辑:我改变了一点点,我不确定这是否是你可以在你的项目中做的事情,但是如果你这样做,它会给你想要的结果。如果这对您有用,请告诉我。
.tieudecuoi {
background-color: #80A5CE;
text-transform: uppercase;
color: #FFF;
font-weight: bold;
font-size: 12px;
margin-top: 0;
margin-bottom: 0;
padding-top: 0px;
padding-bottom: 0;
}
body {
}
table, th, td, tr {
border-collapse: collapse;
border: 1px solid;
}
.tb {
width: 500px;
}
/*2 cell đầu tiên, xác định độ rộng*/
.tdkq {
width: 70%;
vertical-align: top;
}
.tddd {
width: 30%;
vertical-align: top;
}
/*bảng kết quả và đầu đuôi*/
.tbkq {
width: 100%;
word-wrap: break-word;
table-layout: fixed;
float: left;
margin-bottom: 0;
padding-bottom: 0;
}
.tbdd {
width: 100%;
}
/*cột giải và kết quả của bảng kết quả*/
.trkq {
width: 100%;
}
.thkqgiai {
width: 20% !important;
}
.thkqso {
width: 80% !important;
}
.tdkqgiai {
text-align: center;
}
.tdkqso {
text-align: center;
word-wrap: break-word !important;
}
/*cột đầu và đuôi của bảng đầu đuôi*/
.thdddau {
width: 30%;
}
.thddduoi {
width: 70%;
}
/*tiêu đề cho bảng kq*/
.tieudemien {
line-height: 24px;
background-color: #80A5CE;
text-transform: uppercase;
color: #FFF;
font-weight: bold;
font-size: 12px;
width: 500px;
margin-bottom: 0;
padding-bottom: 0;
}

<h2 class="tieudemien"> Kết quả xổ số Miền Bắc ngày 02-11-2014</h2>
<table class="tb">
<tbody>
<tr>
<td class="tdkq">
<table class="tbkq">
<tbody>
<tr class="trkq">
<th class="thkqgiai">Giải</th>
<th class="thkqso">BTB</th>
</tr>
<tr>
<td class="tdkqgiai">Đặc biệt</td>
<td class="tdkqso">23411</td>
</tr>
<tr>
<td class="tdkqgiai">Giải nhất</td>
<td class="tdkqso">37428</td>
</tr>
<tr>
<td class="tdkqgiai">Giải nhì</td>
<td class="tdkqso">38460-75356</td>
</tr>
<tr>
<td class="tdkqgiai">Giải ba</td>
<td class="tdkqso">02055-66542-36814-52154-66881-20546</td>
</tr>
<tr>
<td class="tdkqgiai">Giải bốn</td>
<td class="tdkqso">6300-7736-6062-3408</td>
</tr>
<tr>
<td class="tdkqgiai">Giải năm</td>
<td class="tdkqso">0235-2078-1344-6340-4550-6337</td>
</tr>
<tr>
<td class="tdkqgiai">Giải sáu</td>
<td class="tdkqso">046-421-944</td>
</tr>
<tr>
<td class="tdkqgiai">Giải bảy</td>
<td class="tdkqso">88-98-24-21</td>
</tr>
<tr>
<td colspan="2" class="tieudecuoi">
spadfj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkjn
</td>
</tr>
</tbody>
</table>
</td>
<td class="tddd">
<table class="tbdd">
<tbody>
<tr class="trkq">
<th class="thdddau">Đầu</th>
<th class="thddduoi">Đuôi</th>
</tr>
<tr>
<td class="tdkqgiai">0</td>
<td class="tdkqso">0,8</td>
</tr>
<tr>
<td class="tdkqgiai">1</td>
<td class="tdkqso">1,4</td>
</tr>
<tr>
<td class="tdkqgiai">2</td>
<td class="tdkqso">8,1,4,1</td>
</tr>
<tr>
<td class="tdkqgiai">3</td>
<td class="tdkqso">6,5,7</td>
</tr>
<tr>
<td class="tdkqgiai">4</td>
<td class="tdkqso">2,6,4,0,6,4</td>
</tr>
<tr>
<td class="tdkqgiai">5</td>
<td class="tdkqso">6,5,4,0</td>
</tr>
<tr>
<td class="tdkqgiai">6</td>
<td class="tdkqso">0,2</td>
</tr>
<tr>
<td class="tdkqgiai">7</td>
<td class="tdkqso">8</td>
</tr>
<tr>
<td class="tdkqgiai">8</td>
<td class="tdkqso">1,8</td>
</tr>
<tr>
<td class="tdkqgiai">9</td>
<td class="tdkqso">8</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
&#13;