html表格到层的相对位置,表格列，HTML5中的相对大小

我会使用一些小的javascript来解决你的问题：http://jsfiddle.net/qR9g2/

var tableSize = 400; // example of size

var firstCol = document.getElementById('firstCol_01');

var sizeOfFirstCol = firstCol.offsetWidth;

var myOtherCols = document.getElementsByTagName('td');

var nbcols = myOtherCols.length;

var sizeOtherCols = (tableSize-sizeOfFirstCol)/(nbcols-1);

for(var i=0;i

{

if(myOtherCols[i].className === 'otherCols')

{

myOtherCols[i].style.width = sizeOtherCols+'px';

}

}

首先给出整个表的大小 . 然后去获取第一列的大小，并将其余的宽度分配给其他列 .

编辑：这是一个CSS解决方案 . 它并不完美，但总比没有好：http://jsfiddle.net/qR9g2/2/

在CSS中，主要思想如下：

.col1{

display:table;

float:right;

}

为第一列添加标签 display:table . 对于所有浏览器，这将像 fit-content 一样工作 . 添加 float:right 将第一列推到右侧，"stick"将其推送到表的其余部分 .

视觉效果正是您想要的 . 从消极方面来看，问题是你的 table 占据了更多的位置(左侧) . (基本上如果你有一个包含4列的400px表，它会自动为每列提供4 * 100px . 添加上层CSS解决方案只会将100px右侧的col1移位到该列) .

您总是可以尝试使用负左边距(我不建议)，以便在左侧移动您的 table .