Question

有什么方法可以衡量我的HTML页面，然后找出它的40％或其长度的60％，这样页面的某些元素只会占用那么多？

Answer 1

是的，使用CSS这很简单

<div style="width: 70%;"> this will take up 70% of your width </div>

Answer 2

（在水平对齐方面）您可以使用2个div元素和CSS实现这种样式/标记;

<!--Your HTML-->
<div id="fortypercent" class="next_to_each_other"></div>
<div id="sixtypercent" class="next_to_each_other"></div>
<!--Ends here-->

/***Your CSS***/
div.next_to_each_other {position:relative; float:left;}
div#fortypercent {width:40%;}
div#sixtypercent {width:60%;}
/***Ends here***/

就是这样。

（在垂直对齐方面）您也可以使用2个div元素和CSS实现这种样式/标记;这次标记保持不变，造型如下。

/***Your CSS***/
html, body {width:100%; height:100%; margin:0px; padding:0px;}
div.next_to_each_other {position:relative; float:left;}
div#fortypercent {width:100%; height:40%;}
div#sixtypercent {width:100%; height:60%;}
/***Ends here***/

您可以通过为每个div分配不同的背景颜色来确定它是否有效。

Answer 3

虽然你需要了解JavaScript，但这很容易做到。

这句话将给出“foo”id“bar”的长度，以像素为单位：

foo = document.getElementById('bar').offsetHeight;

如果你那么做

height1 = foo * 0.4;
height2 = foo * 0.6;

你可以用它来做

document.getElementById('height1').style.height = height1 + 'px';
document.getElementById('height2').style.height = height2 + 'px';

使用此方法，您可以查看元素的高度，并根据第一个元素设置其他元素的高度。

告诉我你是否有想要我添加的内容！

HTML页面部分

3 个答案: