html - 将边框设置为表格 tr,适用于除 IE 6 和 7 之外的所有版本

标签 html css html-table

我将表 event_calendar tr 的边框设置为红色,它适用于除 IE 6 和 7 之外的所有版本。我的 CSS 有什么问题?

table#event_calendar tr {
    border:1px solid red;
}

<div class="content-body">
<table id="event_calendar">
    <tr class="calendarHeader">
        <th><div class="calendarMonthLinks"><a href="http://webdev.herkimer.edu/calendar/2009/03/">&lt;&lt;</a></div></th>
        <th colspan="5"><h1>April 2009</h1></th>
        <th><div class="calendarMonthLinks"><a class="calendarMonthLinks" href="http://webdev.herkimer.edu/calendar/2009/05/">&gt;&gt;</a></div></th>
    </tr>
    <tr>
        <td class="calendarDayHeading">Sunday</td>
        <td class="calendarDayHeading">Monday</td>
        <td class="calendarDayHeading">Tuesday</td>
        <td class="calendarDayHeading">Wednesday</td>
        <td class="calendarDayHeading">Thursday</td>
        <td class="calendarDayHeading">Friday</td>
        <td class="calendarDayHeading">Saturday</td>
    </tr>
</table>
</div>

最佳答案

IE 不支持 标签的 border 属性。但是,通过在每个单元格周围放置顶部和底部边框并使用“border-collapse: collapse;”,有一些变通方法。所以细胞之间没有空间。我会引用this resource here确切的方法,但它对你来说基本上看起来像这样(我自己没有测试过,所以我不确定这是否完全正确,但我认为你可以重复一下。)

table#event_calendar {
    border-collapse: collapse;
    border-right: 1px solid red;
    border-left: 1px solid red;
}

table#event_calendar td, table#event_calendar th {
    border-top: 1px solid red;
    border-bottom: 1px solid red;
}

关于html - 将边框设置为表格 tr,适用于除 IE 6 和 7 之外的所有版本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/583539/

相关文章:

html - 需要帮助拆分侧边栏具有 3 个不同的列表高度

javascript - 如何对表行和列结构使用模运算符?

IE 和 Microsoft Edge 中的 jQuery 轮播页面移动

html - 底部对齐 R shiny 中的按钮

asp.net - 如何在 ASP.NET 应用程序中使用 CSS

javascript - 硬表行交换,交换行的父级为空

javascript - 逐列而不是逐行打印 HTML 表格?

css - 在两个 div 中 float

javascript - 我没有在我的页面中看到我的按钮

jquery - 提高页面加载速度的建议