宽度减小时如何增加高度?

Question

当屏幕宽度减小到979px以下时，我想增加div的高度，我想在div样式标签中而不是在CSS文件中执行此操作。

<div class="slider-item overlay" data-stellar-background-ratio="0.5">

.slider-item {
background-size: cover;
background-repeat: no-repeat;
background-position: top center;
height: calc(100vh);
min-height: 700px;
position: relative;
.slider-item:before {
content: "";
position: absolute;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #000;
opacity: .3;

这应该很容易做到(我想，我对 CSS 不是很有信心(，但是当我有：

style="@media (max-width:979px) height:120vw;"

在我的div 标签中没有任何反应。

任何帮助真的很感激，谢谢。

Answer 1

媒体查询的定义如下

@media only screen and (max-width: 979px)
{
.slider-item
{
height:120vw;
}
}

您需要设置要引用的类：在您的情况下，这是滑块项