html - 手机优先。媒体查询不适用于特定的 div

Question

我是编码新手。我正在制作我的第一个网站(移动优先)。一切都很好，所有 div 都在工作， react 灵敏，一切都很棒!但是现在我添加了一个新的 div(我猜没什么特别的)但是当我尝试只放置一个代码时(即使没有媒体查询)它在移动版本中不起作用。平板电脑和台式机工作正常。我尝试修改其他 div，它们也能正常工作。

这是代码。

HTML

<section class="flvcko-wear">
  <ul class="lista-articulos">
    <div class="articulo">
      <li>
        <img src="img/cap.png" alt="">
        <p>Flvcko cap</p>
      </li>
    </div>
  </ul>
</section

CSS

 .flvcko-wear ul{
          list-style-type: none;
        }

它甚至无法识别“list-style-type:none;”

Answer 1

这可能是由奇怪的 HTML 结构引起的——div 不允许作为 ul 的子级(尝试将您的代码粘贴到 HTML 验证器中)。

这样更有意义:

<section class="flvcko-wear">
  <ul class="lista-articulos">
    <li>
      <div class="articulo">
        <img src="…" alt="…">
        <p>…</p>
      </div>
    </li>
  </ul>
</section>

或者甚至完全省略 div，因为您也可以设置 li 的样式:

<section class="flvcko-wear">
  <ul class="lista-articulos">
    <li class="articulo">
        <img src="…" alt="…">
        <p>…</p>
    </li>
  </ul>
</section>