css - LESS 使用变量

Question

我对 LESS 很新鲜。我不确定在何处查看此文档或是否可能。

我有一个容器，它有 height:auto。它是一个会增长的内容容器。

我可以有第二个容器吗？container2:height = container1:height。

这样第二个容器就会变成和height:auto的容器一样大

这当然可以用 javascript 来完成，但我很好奇这是否可以用 LESS 来完成。

P.S.:如果有人想插入任何好的 LESS 教程/阅读 Material ，我会很高兴看到它。

Answer 1

这不是关于 less 的问题，而是关于 css 的问题。

要在不知道(或给定高度)的情况下使内部 div 元素适应与外部元素相同的高度，您可以这样做:

HTML:

<div class="outer">
    <div class="inner"></div>
</div>

CSS:

.outer{
    margin: 0 auto;
    width: 300px;
    height: 300px;
    position: relative;

}
.inner{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

因此您可以确定内部 DIV 始终与外部 DIV 具有完全相同的大小

更新:

当 DIV 元素不应该相互重叠时，您可以这样做:

.inner{
    position: absolute;
    top: 100%;
    bottom: -100%;
    left: 0;
    right: 0;
}

现在第二个 DIV 具有完全相同的高度，并且位于第一个 DIV 之下 :)