Question

的更新对不起，大家都感到困惑......我实际上是想问一下扩大div高度的最佳做法是什么？如果我将200px宽度和300px高度转换为可伸缩div，则宽度为20％。我怎样才能缩放高度？就像......如何在不使用px的情况下保持比例？有没有像根据宽度设置高度的方法？有什么说，使用50％的宽度尺寸或类似的东西？我只需要一种方法来保持div的比例，而div调整宽度......

我有一个需要保留固定像素的父容器。但是，我希望所有的孩子都是流动的。但是在转换高度方面我有点困惑。

我们的代码曾经是这样的：

#parent {width: 1000px;}
#child {width: 200px; height: 300px;}

我的新代码让孩子变得流畅，是这样的：

#parent {width: 1000px;}
#child {width: 20%;}

有没有办法以百分比设置子项的高度（在此示例中等于300px），而不设置父项的高度？

Answer 1

您的问题不够明确，但您需要知道，只要父元素位于height: auto，您就可以将孩子的身高设置为100％：

#parent {
    height:auto; 
    width: 1000px; 
}
#child {
    height:300px; 
    width: 30%; 
}

小提琴：http://jsfiddle.net/7wxqE/

进一步阅读：

现在，如果您想在父级中放置多个浮动子级，让我们说3个列，您需要浮动子级和父级，并将position: relative添加到父级和子级：

#parent {
    height:auto; 
    position: relative;
    width: 1000px; 
    float: left;
}
#child {
    height:100%; 
    width:30%; 
    float: left;
    position: relative;
}

小提琴：http://jsfiddle.net/4ntn5/

Answer 2

我不知道如何在css中执行此操作，但我可以在javascript中执行此操作

获取父元素的宽度
计算宽度的百分比
然后将计算出的值应用于子元素的高度。

像

var parentWidth = $("#parent").width();
var childHeight = Number(parentWidth) * 0.30;
$("#child").height(childHeight);

我认为css中没有技术可以根据父元素的宽度应用高度。我的意思是我从任何地方都无法获得。

将固定容器转换为流体......如何设置高度？

2 个答案:

进一步阅读：