我使用的是Firefox 3.5.7,并且我在多个HTML表格中使用了相同的CSS,但是有些示例中没有显示部分边框.

对我来说没有意义的是,另一个HTML表格在同一页面上的相同CSS工作正常.此外,从边界的角度来看,Internet Explorer中的同一页面看起来很好.

这是一个带有示例的图像,在这种情况下您可以看到第一个表的底部缺少边框.

有没有人知道为什么会发生这种情况？

可能重复:
带固定标题的HTML表格？

我已经尝试了几种方法从HTML表中获取带有固定标题的滚动条但没有运气.我想我需要一个解决方案,其中标题以某种方式"附加"到表体(而不是典型的嵌套表解决方案).我尝试的每个解决方案都会影响标题列和正文列的宽度.换句话说,它们不同步,并且标题的列与滚动表的列不正确对齐.标题和列的宽度因列而异.

有什么方法可以让我实现这个目标吗？我宁愿不使用JavaScript.哦,我也需要这个在Internet Explorer中工作.

更新:获得此功能对我来说非常重要.我需要在固定头两列和行头.到目前为止,还没有任何解决方 我考虑使标题分开表,但滚动时这不起作用,因为标题将保持固定.

看起来固定的HTML标题会有很多用例,所以我很惊讶没有足够的解决方案.

(哦,我在链接中尝试了opatut建议的选项,但它并不适用于所有浏览器,我需要在Internet Explorer,Firefox和Chrome中使用此工作.如果它在Internet Explorer 6中不起作用,那就没问题) .

哦,如果我必须修复列宽或行高,那也没关系,我会很高兴有一个有效的固定标题HTML表(跨浏览器).

我最近发现我需要在表格中使用cellspacing属性,但我想知道我是否可以让它只能水平工作.我不希望它垂直展开,这会弄乱我整个页面的布局.

我将表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>

使用jQuery,如何在下面的示例表中找到任意表单元格的列索引,以便跨越多列的单元格具有多个索引？

HTML

<table>
  <tbody>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td id="example1">Three</td>
      <td>Four</td>
      <td>Five</td>
      <td>Six</td>
    </tr>
    <tr>
      <td colspan="2">One</td>
      <td colspan="2">Two</td>
      <td colspan="2" id="example2">Three</td>
    </tr>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td>Three</td>
      <td>Four</td>
      <td>Five</td>
      <td>Six</td>
    </tr>
  </tbody>
</table>

jQuery的

var cell = $("#example1");
var example1ColIndex = cell.parent("tr").children().index(cell);
// == 2. This is fine.

cell = $("#example2");
var example2ColumnIndex = cell.parent("tr").children().index(cell);
// == 2. It should be 4 (or 5, but I only need the lowest). How can I do this?

如何在ASP.NET表中创建thead和tbody？我需要那些标签,因为jquery和asp.net只给我tr,th和td.

我有一个看起来像这样的表,这是它的标记

______________________
_____|_______|________
_____|_______|________

<table>
<tbody>
<tr>
 <td>row 1 column 1</td>
 <td>row 1 column 2</td>
 <td>row 1 column 3</td>
</tr>
<tr>
 <td>row 2 column 1</td>
 <td>row 2 column 2</td>
 <td>row 2 column 3</td>
</tr>
</tbody>
</table>

如何将整个第二列合并为1个单元格,以便表格如下所示.可能吗？

_____________________________
________|          |_________
________|__________|_________

我希望将一个表头并排放在两个表列的中心.这可能吗？

编辑:所选答案包含一个指向工作小提琴的链接,我可以在不使用嵌套表的情况下编写.

我想用HTML语义编写一个表格,其布局如下图所示.不幸的是,我无法在网络上找到任何类似的东西.

我已经能够通过手动设置单元格宽度强制外观,但我想确保我生成的代码有意义,我不认为是这种情况,因为没有手动设置宽度,标准渲染看起来更多如下图.

到目前为止,我提出的有问题的代码看起来像这样:

<table>
  <thead>
    <tr>
      <th scope="col">Type of Loss Dollar</th>
      <th scope="col">Reserve Amount</th>
      <th scope="col">Paid Amount</th>
      <th scope="col">Total This Loss</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td colspan="3">
        <table>
          <tbody>
            <tr>
              <th scope="row">Medical</th>
              <td><input type="text" /></td>
              <td><input type="text" /></td>
            </tr><tr>
              <th scope="row">Indemnity</th>
              <td><input type="text" /></td>
              <td><input type="text" /></td>
            </tr><tr>
              <th scope="row">Expense</th>
              <td><input type="text" /></td>
              <td><input type="text" /></td>
            </tr>
          </tbody>
        </table>
      </td><td>
        TOTAL
      </td>
    </tr>
  </tbody>
</table>

我正在使用表格在每个页面上创建一个页脚(在Firefox中运行,这就足够了).

JS小提琴:https://jsfiddle.net/j9k2xzze/

(右键单击输出窗格 - >此框架 - >在新选项卡中打开框架.然后打印预览将正常运行)

<table id="wrapper">
    <thead>
    <tr>
        <td id="header"></td>
    </tr>
    </thead>

    <tfoot>
    <tr>
        <td colspan="0" id="footer">
            <img src="footer.jpg"/>
        </td>
    </tr>
    </tfoot>

    <tbody>
    <tr>
        <td id="content">
            <?php echo $html; ?>
        </td>
    </tr>
    </tbody>
</table>

但是在最后一页上,表格页脚直接显示在文本下方.如果文本比最后一页短,则页脚会粘到它上面.

我喜欢页脚在最后一页的最底部.不幸的是@page扩展名在firefox中不起作用,或者我做错了:

@page:last {
  #footer {
    position: absolute;
    bottom: 0;
  }
}