Блог

Главная - Вопросы по программированию - неожиданные эффекты двух секций :цель сразу после смены устройства в FF

неожиданные эффекты двух секций :цель сразу после смены устройства в FF

#html #css

Вопрос:

Я разработал страницу упрощенной формы, подобную этой:

 <html>
<head></head>
<body>
<nav></nav>

<main>
<section id ="Introduction"></section>
<section id ="aboutme"></section>

<a href="#Introduction">
  <span class="triangle__more">
      <img src="./assets/up-arrow.svg" alt="arrow up" />
  </span>
</a>

</main>

<body>
</html>

с помощью css:

 .section {
    @include clearfix();
    min-height: 100vh;
    width: 100%;
    position: relative;
    display: none;
    amp;:target {
        display: block;
    }

Проблема в том, что если я сделаю такие шаги, как это:

  1. откройте страницу с ноутбуком на реальном ноутбуке
  2. измените раздел на #обо мне с меню(здесь нет подробностей меню)
  3. измените устройство в инспекторе на любое из устройств с малым экраном
  4. измените раздел на #Введение со ссылкой внизу

У меня активны оба раздела(отображаются), а не только #Введение (каков был мой ожидаемый результат). Я также заметил, что изменение только размера экрана или ориентации (а не устройства) не приводит к этому нежелательному эффекту. Может ли кто-нибудь объяснить мне, почему это происходит (это чисто проблема инспектора FF)? И смогу ли я чувствовать себя в безопасности с этим кодом в реальной жизни (где никто не меняет устройство во время сеанса).

Комментарии:

1. вы на самом деле подписываетесь ванилью CSS или SASS или LESS ? Если это так, отметьте соответствующим образом, потому что для CSS вложенность была бы недопустимой.

2. Вы проверили элемент, который не должен отображаться, чтобы увидеть, какое правило, в частности, может перезаписать его display:none из .section правила …?

Ответ №1:

Хорошо, наконец, я думаю, что это скорее ошибка консоли Firefox. Я проверил в другом браузере, и все в порядке. Кроме того, когда я изменяю ширину окна просмотра только по номерам — это нормально. Это действительно происходит только тогда, когда я переключаю устройство. Надеюсь, довольно необычное в реальной жизни.

Метки: