所以我有下一个结构：
body{
margin:0px;
background-color:#f2f0f2;
width:100%;
height: 100%;
}
.container {
display: inline-block;
height:330%;
}
/* ============================================================
Parallax
============================================================ */
div.module.content {
background-color:#f2f0f2;
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
vertical-align: middle;
height:330%;
}
div.module.parallax {
background-position: 50% 50%;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background: rgba(25, 25, 25, .5);
vertical-align: middle;
text-align: center;
background-image: url(../img/overlay-pattern.png);
background-repeat: repeat;
height:330%;
} <div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>
</div>
</div>
<div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>
</div>
</div>
<div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
</div>
我试图将％的高度设置为％并且它必须正常工作，但它不会，它只接受px或vw，但它不接受％的值。
为什么这样？我该如何解决？
我觉得这是一个非常简单的原因，但我没有看到它。
答案 0 :(得分：3)
由于您没有为父元素设置高度，因此无法计算元素的百分比？
设置html { height: 100%; }可让浏览器了解父元素的高度。
html {
height: 100%;
}
body {
margin: 0px;
background-color: #f2f0f2;
width: 100%;
height: 100%;
}
.container {
display: inline-block;
height: 330%;
}
/* ============================================================
Parallax
============================================================ */
div.module.content {
background-color: #f2f0f2;
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
vertical-align: middle;
height: 330%;
}
div.module.parallax {
background-position: 50% 50%;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background: rgba(25, 25, 25, .5);
vertical-align: middle;
text-align: center;
background-image: url(../img/overlay-pattern.png);
background-repeat: repeat;
height: 330%;
}<div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>
</div>
</div>
<div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>
</div>
</div>
<div class="module parallax">
<div class="container">
<h1>Lorem Ipsum</h1>
</div>
</div>
<div class="module content">
<div class="container">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
</div>