5,006
社区成员
发帖
与我相关
我的任务
分享
<script type="text/javascript">
function getStyle(obj, style) {
var _style = (style == "float") ? "styleFloat" : style;
return document.defaultView ? document.defaultView.getComputedStyle(obj, null).getPropertyValue(style) : obj.currentStyle[_style.replace(/-[a-z]/g, function() {
return arguments[0].charAt(1).toUpperCase();
})];
}
window.onload = function() {
document.getElementById("info").innerHTML = "display : " + getStyle(document.getElementById("tester"), "float");
}
</script>
<table id="tester" style="background-color: red;" align="left">
<tr>
<td>hello</td>
</tr>
</table>
<div id="info" style="background-color:blue; width:200px; overflow:hidden;"></div>
以上代码中,TABLE 有一个属性 align=’left’,说实话,这个属性没什么用,因为它本身就是一个左对齐的表格,但是,请注意它后面的div,这个div中会输出 TABLE 加align属性后的float特性的值;按道理讲,div应该另起一行来显示,注意我给他设置了 overflow:hidden,这时候,它会创建 BFC,而DIV拥有固定宽度也会触发 hasLayout 。<div style="width:300px;">
<div style="background:#DDD; padding:5px; border:5px solid red;">
<iframe align="left" style="width:100px; height:42px;"></iframe>
<iframe align="left" style="width:100px; height:42px;"></iframe>
<iframe align="right" style="width:100px; height:42px;"></iframe>
</div>
</div>
截图: