标签: html-table

我想知道将tables用于表单是否可以接受.

严格来说,名称/值对是表格数据,不是吗？表单只是一组用户可自定义的名称/值对.那么table在这种情况下使用s 是否正确？或者我应该使用divCSS样式？

我正在尝试创建一个包含许多静态html表的页面.

我需要做些什么才能让它们显示与表中每个列相同大小的每个列？

HTML如下:

<span class="Emphasis">Interest rates</span><br />
<table cellpadding="0px" cellspacing="0px" class="PerformanceTable">
    <tr><th class="TableHeader"></th><th class="TableHeader">Current rate as at 31 March 2010</th><th class="TableHeader">31 December 2009</th><th class="TableHeader">31 March 2009</th></tr>
    <tr class="TableRow"><td>Index1</td><td class="PerformanceCell">1.00%</td><td>1.00%</td><td>1.50%</td></tr>
    <tr class="TableRow"><td>index2</td><td class="PerformanceCell">0.50%</td><td>0.50%</td><td>0.50%</td></tr>
    <tr class="TableRow"><td>index3</td><td class="PerformanceCell">0.25%</td><td>0.25%</td><td>0.25%</td></tr>
</table>
<span>Source: Bt</span><br /><br />

<span class="Emphasis">Stock markets</span><br />
<table cellpadding="0px" cellspacing="0px" class="PerformanceTable">
    <tr><th class="TableHeader"></th><th class="TableHeader">As at 31 March 2010</th><th class="TableHeader">1 month change</th><th class="TableHeader">QTD change</th><th class="TableHeader">12 months change</th></tr>
    <tr class="TableRow"><td>index1</td><td class="PerformanceCell">1169.43</td><td class="PerformanceCell">5.88%</td><td class="PerformanceCell">4.87%</td><td class="PerformanceCell">46.57%</td></tr>
    <tr class="TableRow"><td>index2</td><td class="PerformanceCell">1958.34</td><td class="PerformanceCell">7.68%</td><td class="PerformanceCell">5.27%</td><td class="PerformanceCell">58.31%</td></tr>
    <tr class="TableRow"><td>index3</td><td class="PerformanceCell">5679.64</td><td class="PerformanceCell">6.07%</td><td class="PerformanceCell">4.93%</td><td …

我想隐藏表格特定行的边框.怎么做？
任何的想法？
示例代码是高度赞赏的.

根据W3 Schools的这篇文章,可以在HTML中创建一个基本表,如下所示:

<table border="1">
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

从上面看,似乎按行输入数据.

我有一种情况需要按列输入所有数据.这样的事情可能吗？

<table border="1">
    <tc>
        <td>row 1, cell 1</td>
        <td>row 2, cell 1</td>
    </tc>
    <tc>
        <td>row 1, cell 2</td>
        <td>row 2, cell 2</td>
    </tc>
</table>

我有一个表,当我将表设置为100%的宽度和表行宽度pf 100%没有任何反应或更改宽度.

.Table-Normal {
    position: relative;
    display: block;
    margin: 10px auto;
    padding: 0;
    width: 100%;
    height: auto;
    border-collapse: collapse;
    text-align: center;
}

.Table-Normal thead tr {
    background-color: #E74C3C;
    font-weight: bold;
}

.Table-Normal tr {
    margin: 0;
    padding: 0;
    border: 0;
    border: 1px solid #999;
    width: 100%;
}

.Table-Normal tr td {
    margin: 0;
    padding: 4px 8px;
    border: 0;
    border: 1px solid #999;
}

.Table-Normal tbody tr:nth-child(2) {
    background-color: #EEE;
}

<table id="top-leader" class="Table-Normal">
    <thead>
        <tr>
            <td>Position</td>
            <td>Name</td>
            <td>Kills</td>
            <td>Deaths</td>
        </tr> …

我正在尝试创建一个表来显示个人的BMI.

作为其中的一部分,我想,on:hover,for <tr> 和 <col>(或<colgroup>)也要突出显示,以便交叉更加明显.

由于该表将同时包含公制和英制测量,因此:悬停不必停在单元格(从任何方向),并且如果它从一个轴延伸到另一个轴,实际上将是奖励.我也使用XHTML 1.1 Strict doctype,如果这有所不同？

所以...一个例子(真正的桌子......更大),但这应该具有代表性:

<script>

tr:hover {background-color: #ffa; }

colgroup:hover,
col:hover {background-color: #ffa; }

</script>

...

<table>
    <col class="weight"></col><colgroup span="3"><col class="bmi"></col></colgroup>

    <tr>
        <th></th>
        <th>50kg</th>
        <th>55kg</th>
        <th>60kg</th>
    </tr>

    <tr>
        <td>160cm</td>
        <td>20</td>
        <td>21</td>
        <td>23</td>
    </tr>

    <tr>
        <td>165cm</td>
        <td>18</td>
        <td>20</td>
        <td>22</td>
    </tr>

    <tr>
        <td>170cm</td>
        <td>17</td>
        <td>19</td>
        <td>21</td>
    </tr>

</table>

我问不可能,我需要去JQuery病房吗？

我使用以下css旋转表头单元格内的文本,但标题单元格的宽度与文本是水平的相同.如何旋转文本,宽度将自动减少..

    table#MyTable tr th a{
    color: #FFFFFF;
    display: block;
    /*Firefox*/
    -moz-transform: rotate(-90deg);
    /*Safari*/
    -webkit-transform: rotate(-90deg);
    /*Opera*/
    -o-transform: rotate(-90deg);
    /*IE*/
    writing-mode: tb-rl;
    filter: flipv fliph;
    padding: 60px 1px;
}

我有一个360px宽的HTML表,效果很好.挑战在于http://this/is/a/really-really-really-really-really/long/url文本中有时会出现网址.这会导致表格水平展开,并在底部显示滚动条.

我认为overflow:hidden不会起作用,因为一半的文本会被隐藏.

什么是在CSS中强制破坏斜线(/)和短划线( - )的最佳方法(希望如此)？

它应该适用于IE7 +,Chrome,Firefox和Safari.

在Rails 3和jQuery中工作.

如何从td我当前进入父表标签？

我试过.parents('table')但是选择了除了之外的所有表格td,我只需要当前的表格

我正在寻找一种只使用CSS"打破"表行的方法.

我想改变这个:

对此:

我无权访问HTML,但可以控制CSS.

我试过了

td:nth-child(3) {
    display: block;
}

但它似乎没有用.

以下是一些用于测试的简化代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
td:nth-child(3) {
    display: block;
    background-color: yellow;
}
</style>
</head>

<body>
<table border="1">
    <tr>
        <td>111111</td>
        <td>222222</td>
        <td>333333</td>
        <td>444444</td>
    </tr>
</table>
</body>
</html>