Подтвердить что ты не робот

Наследование свойства типа списка в Firefox (ошибка в Firebug?)

Посмотрим на несколько комментариев 1) на странице, созданной Wordpress (это не сайт, который я поддерживаю, мне просто интересно, что здесь происходит). Поскольку эти страницы могут исчезнуть в ближайшем будущем, я поставил несколько скриншотов в Интернете. Вот что я увидел:

Screenshot of comments, together with the nifty little Firebug thing

Очевидно, маркеров элемента списка не должно быть. Поэтому я решил посмотреть источник, используя Firebug. Как вы можете видеть, Firebug утверждает, что свойство list-style (содержащее none) наследуется от ol.commentlist. Но если это так, то почему круг и квадрат видны? При проверке вычисленного стиля Firebug правильно показывает list-style-type.

Какое правильное поведение? Я просто быстро проверил Chromium, чей веб-инспектор дал более полное представление о реальности (маркеры элементов списка также отображались в этом браузере):

View of Chromium's web inspector showing the same page

В соответствии с WebKit list-style of ol.commentlist не наследуется, только значение по умолчанию list-style-type из механизма рендеринга.

Итак, мы можем заключить, что вывод обоих браузеров верен и что Firefox (Firebug) показывает неправильное представление унаследованных стилей. Что говорит спецификация CSS?

Наследование перенесет list-style значения от OL и ULэлементов в элементы LI. Это рекомендуемый способ указания стиля списка информация.

Немного о наследовании свойств OL к UL s. Является ли Firebug неправильным в этом отношении или должен вложить UL наследовать (некоторые) свойства из OL (и если да, то почему не являются элементами, отображаемыми соответственно в двух совершенно разных браузерах)? Чтобы быть ясным, мой фактический вопрос: какие свойства должны вложенные элементы UL наследовать от элементов OL, которые их заключают?

РЕДАКТИРОВАТЬ: Я забыл о Opera, и картина становится еще более понятной при просмотре этого инспектора браузера:

Opera's web inspector pane

Как показывает правильная область, вложенные элементы UL наследуют свойства от элементов OL, но значения по умолчанию для браузера list-style-type и list-style-position переопределяют значения, указанные его родителем.

Как Vinhboy поддерживает мое подозрение, что это ошибка где-то (Firefox? Firebug?), я подал отчет об ошибке .


Кстати, мне удалось оставить маркеры, просто изменив строку 312 стиля .css на

ol.commentlist, li.commentlist, ul.children {

При явном определении list-style от ul.children до none маркеры не окрашиваются. Вы можете посмотреть скриншоты Firebug и WebKit Web Inspector в этом случае, если хотите.


1). После обращения к разработчику страницы он исправил маркеры нежелательного списка, поэтому вы больше не видите эту проблему (без редактирования CSS на лету). Вы все еще можете посмотреть скриншоты, чтобы узнать, что это такое, но я также сделал тестовый пример и добавил это в мой отчет отчет об ошибке. Для удобства пользователей источник HTML/CSS читает:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>&lt;ol&gt;/&lt;ul&gt; inheritance test case</title>
  <style>
   ol {
     list-style: none;
   }
  </style>
 </head>
 <body>
  <!-- Some of the text below is quoted from D.E. Knuth, The TeXBook, p. 395 -->
  <ol>
   <li>First item</li>
   <li>Second one</li>
   <li>Now let have some fun with a nested &lt;ul&gt;:
    <ul>
     <li>First item</li>
     <li>And the second one again (this is incredibly boring, but it just an example)</li>
     <li>Ho hum</li>
     <li>Are you still there?</li>
    </ul>
   </li>
   <li>Just another item</li>
  </ol>
 </body>
</html>

Просто выберите UL и обратите внимание, что Firebug говорит, что он унаследовал свойство стиля списка из OL (хотя это не так, когда мы смотрим на реально отображаемую страницу).

Просьба сравнить это с веб-инспектором WebKit и особенно с Opera вариант. Последний явно делает ясно, что он возвращается к браузеру значения по умолчанию list-style-type и list-style-position.

4b9b3361

Ответ 1

На самом деле, ваше предположение о наследовании стиля немного не работает. Наследование будет от li.commentlist, а не ol.commentlist. Причиной несоответствия является то, что Firefox принимает стиль списка типов к элементам списка, а также к оболочкам списка. Чтобы полностью отключить пули в неупорядоченном списке, вы должны установить тип списка для тега UL. Именно поэтому я всегда удаляю тип списка из оболочки списка и применяю его к элементам списка.

Это лишь одна из тех различий между браузерами, которые все мы должны изучать и настраивать. Другим примером этой несогласованности является использование поля и отступов в теге BODY. Чтобы обеспечить согласованность рендеринга во всех браузерах, которые вы удаляете, следует указать маржу и затем установить дополнение.