Question

你能告诉我完整的html代码，其中有一个矩形，其中“height =我屏幕的75％”和“widtht = 4/3的高度”。因此，它应该是3：4reсtangle，其中高度取决于我的屏幕高度，但宽度不取决于我的屏幕宽度。只有屏幕高度。

我认为我理解了时间，但事实并非如此。

我有这个：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="colorbox/jquery.colorbox.js"></script>
<script type="text/javascript">
    $(document).ready(function(){ 
        $(".example7").colorbox({width:"80%", height:"80%", iframe:true});
    });
</script>

我不知道如何处理宽度。

Answer 1

HTML并没有规定这一点。 CSS可以，但CSS没有任何直接的内部数学逻辑。所以，你需要做的是使用javascript。

加载页面时，抓住对象的宽度，算一算，然后设置高度。

如果您是JS的新手，我建议您学习其中一个库，例如jQuery。在jQuery中，它看起来像这样：

$('#myDiv').width($(this).height()*.75);

Answer 2

你需要JavaScript来计算宽度，不可能只用HTML来做这件事。

相关财产为window.innerHeight;乘以（3/4）得到高度，并且因为（3/4）*（4/3）== 1，window.innerHeight（顺便提一下）等于你想要的宽度。

然后设置元素的.height和.width属性。

注意：我假设你希望有一个与浏览器窗口成比例的矩形，而不是用户的屏幕。如果您确实需要屏幕尺寸，请使用window.screen.height代替window.innerHeight;但请注意：随着宽屏和多显示器配置的增加，浏览器可能会报告非常古怪的尺寸。

宽度取决于高度

2 个答案: