javascript - HTML表格行的边框未显示在jsPopUp窗口中？

Question

这是情况如果我为表格行应用边框，它没有显示我也内联使用它，但输出没有区别：

代码：

<style>
.dispTab{
    border:1px solid black;
    width:100%;text-align:left;line-height:30px;
}
.dispTab tr{
    border:1px solid black;
}

</style>
<table id="dispTab" class="dispTab" >
    <thead >
        <tr style="border:1px solid black">
            <th class="leftalign">Date
            </th>
            <th class="leftalign">Time
            </th>
            <th class="leftalign">Location
            </th>

        </tr>
    </thead>
    <tbody>

<tr><td>01/05/2013<br/>Wednesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>02/05/2013<br/>Thursday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>03/05/2013<br/>Friday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>04/05/2013<br/>Saturday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>05/05/2013<br/>Sunday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>06/05/2013<br/>Monday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>07/05/2013<br/>Tuesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>08/05/2013<br/>Wednesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>09/05/2013<br/>Thursday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>10/05/2013<br/>Friday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>11/05/2013<br/>Saturday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>12/05/2013<br/>Sunday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>13/05/2013<br/>Monday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>14/05/2013<br/>Tuesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>15/05/2013<br/>Wednesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>16/05/2013<br/>Thursday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>17/05/2013<br/>Friday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>18/05/2013<br/>Saturday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>19/05/2013<br/>Sunday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>20/05/2013<br/>Monday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>21/05/2013<br/>Tuesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>22/05/2013<br/>Wednesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>23/05/2013<br/>Thursday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>24/05/2013<br/>Friday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>25/05/2013<br/>Saturday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>26/05/2013<br/>Sunday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>27/05/2013<br/>Monday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>28/05/2013<br/>Tuesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>29/05/2013<br/>Wednesday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>30/05/2013<br/>Thursday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr><tr><td>31/05/2013<br/>Friday</td><td colspan="2" style="text-align:center;">No Meetings</td></tr></tbody>
</table>    

Answer 1

• 将边框应用于单元格，而不是行。
• 如果您不想要垂直单元格分隔符边框，请关闭border-left和border-right关闭。
• 如果您希望表格不“笨拙”，请折叠边框

参见 CSS：

.dispTab{
    border-collapse: collapse;
    border: 1px solid black;
    width: 100%;
    line-height: 30px;
}
.dispTab th, .dispTab td {
    border: 1px solid black;
    border-left: 0 none;
    border-right: 0 none;
}

Answer 2

做这样的事情，小提琴

添加边框折叠：折叠

.dispTab {
    border:1px solid black;
    width:100%;
    text-align:left;
    line-height:30px;
    border-collapse:collapse 
}

Answer 3

.dispTab{
   border:1px solid black;
   width:100%;
   line-height:30px;
   border-collapse:collapse 
}
.dispTab td {
    border:1px solid black;
 }

Answer 4

我得到了答案：

.dispTab{
    border:1px solid black;
    width:100%;
    text-align:left;
    line-height:30px;
    border-collapse:collapse 
}
.dispTab th, .dispTab td{
    border:1px solid black;
    border-collapse:collapse;
}