Question

＆＃13;

<script src='https://cdnjs.cloudflare.com/ajax/libs/eqcss/1.2.1/EQCSS.min.js'></script>
<div class="div1">Click and drag until larger than 300px ➷</div>

＆＃13;

{{1}}

＆＃13;

它在Dot Net中无效。它只适用于HTML页面。一个问题是媒体查询可以根据div元素而不是屏幕来调整大小吗？

Answer 1

在普通的CSS中：你想要什么是不可能的，但你不需要它。你已经有了答案。使用css媒体查询但仅定义需要在特定宽度限制中更改的类。如下所示。

setIcon()

div {
  display: inline-block;
  padding: 30px;
  color: sienna;
  background: ivory;
  border: 1px solid goldenrod;
  overflow: auto;
  resize: horizontal;
}

@media and (min-width: 300px) {
  .div1 {
    background: gold;
  }
}

@media and (min-width: 600px) {
  .div1 {
    background: red;
  }
}

但是，如果您查看documentation of EQCSS,，则可以执行此操作

<script src='https://cdnjs.cloudflare.com/ajax/libs/eqcss/1.2.1/EQCSS.min.js'></script>
<div class="div1">Click and drag until larger than 300px ➷</div>

所以代码是：

@element .minwidthpixels and (min-width: 500px) {
  .minwidthpixels {
    background: gold;
  }
}

我们可以根据div宽度添加媒体吗？

1 个答案: