HTML:
<div class="table" >
<div class="row" >
<span>Tb with DIV</span> <span>col2</span> <span>col3</span>
</div>
<div class="row" >
<span>col1</span> <span>col2 test</span> <span>col3</span>
</div>
<div class="row" > <span>col1</span> <span>col2</span> <span>col3 test</span>
</div>
</div>
<table>
<tr id="testRow">
<td>Tb with <'table'></td> <td>col2</td> <td>col3</td>
</tr>
<tr >
<td>col1</td> <td>col2 test</td> <td>col3</td>
</tr>
<tr >
<td>col1</td> <td>col2</td> <td>col3 test</td>
</tr>
</table>
CSS:
.table, table {
display:table;
/*
width:200px;
height:100px;
zoom:1;
*/
}
.row { display:table-row; }
.row, tr {
width:200px !important;
min-height:1px !important;
zoom:1;
white-space:nowrap;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
filter: alpha(opacity=20);
-moz-opacity:0.2;
-khtml-opacity: 0.2;
opacity: 0.2;
}
.row span, td {display:table-cell;padding: 5px;}
Java脚本
$(function () {
console.log (document.getElementById('testRow2').currentStyle.hasLayout);
//$('.row, tr').fadeTo('fast',0.2);
});
jsbin
jsfiddle
因为不透明度不起作用,所以我应该在控制台(对于IE7&8)中获取“ false”,但结果为“ true”
元素是否确实具有“ hasLayout”功能,但不透明度由于其他原因而无法正常工作?
尽管我对此表示怀疑,因为甚至连jQuery都无法设置不透明度。
最佳答案
看起来所有“表”元素默认都有hasLayout===true
。 opacity
的tr
不起作用,因为您需要为opacity
定义td
。