我正在建立一個(gè)簡(jiǎn)單的網(wǎng)站。我有充滿“模塊”的彈性盒子，其中包含文本內(nèi)容。當(dāng)這些模塊之一懸停在上面時(shí)（使用本文未包含的 JavaScript 代碼，因?yàn)樗ぷ髡＃?，我希望出現(xiàn)一個(gè)“陰影”，它使整個(gè)模塊變暗并顯示一個(gè)按鈕。我在將陰影設(shè)置為正確的尺寸時(shí)遇到了很多麻煩：每個(gè)模塊寬度和高度的 100%。由于某種原因，高度和寬度不會(huì)從模塊繼承到陰影。HTML：<div class="support">    <div class="module">        <div class="shade">            <a href="#"><button type="button" class="source_btn">View Source</button></a>        </div>        <div class="content">            <h1>Homocide rates have skyrocketed in the United States.</h1>            <p>Jeffery Miron, an economist estimates that the homicide rate in America is as much as seventy-five percent higher $        </div>    </div>    <div class="module">        <div class="shade">            <a href=""><button type="button" class="source_btn">View Source</button></a>        </div>        <div class="content">            <h1>Drug markets are forced to solve their disputes through violence.</h1>            <p>Because the War on Drugs has forced drug markets into the shadows, there is now way they can settle disputes throu$        </div>     </div>    <div class="module">        <div class="shade">            <a href=""><button type="button" class="source_btn">View Source</button></a>        </div>        <div class="content">            <h1>The violence is not only occurring in the United States.</h1>            <p>For some perspective, there have been almost one hundred thousand deaths in Mexico in the past decade caused not b$        </div>    </div></div>CSS： section .support {     display: flex;     flex-direction: row;     background: var(--bg);     height: 60vh; } .module {     flex: 1;     text-align: center;     height: inherit; } .module .content h1 {      margin-top: 5rem;     margin-bottom: 5rem;     font-size: 2.5rem; }如果有 3 個(gè)模塊，我就能得到確切的預(yù)期效果。我相信這意味著寬度和高度是從其他地方繼承的，我不知道為什么。我需要能夠在 .shade 樣式中說width: 100%and以使陰影占據(jù)整個(gè)模塊，因?yàn)槊總€(gè)支持類會(huì)有不同數(shù)量的模塊。height: 100%我很困惑為什么寬度和高度沒有像我期望的那樣被繼承。既然 .shade 是 .module 的子級(jí)，為什么寬度和高度不繼承自 .module div 呢？