Давайте посмотрим некоторые комментарии 1) на странице, созданной Wordpress (это не сайт, который я поддерживаю, мне просто интересно, что здесь происходит). Поскольку эти страницы могут исчезнуть в ближайшем будущем, я выложил несколько скриншотов онлайн. Вот что я увидел:
Очевидно, маркеров элементов списка там быть не должно. Поэтому я решил посмотреть на источник, используя Firebug. Как видите, Firebug утверждает, что свойство list-style
(содержащее none
) унаследовано от ol.commentlist
. Но если это так, то почему видны круг и квадрат? При проверке вычисленного стиля Firebug правильно показывает list-style-type
s.
Какое правильное поведение? Я только что сделал быструю проверку в Chromium, веб-инспектор которого дал лучшее представление о реальности (маркеры элементов списка также отображались в этом браузере):
Согласно WebKit, list-style
из ol.commentlist
не наследуется, только значение по умолчанию list-style-type
от движка рендеринга.
Итак, мы можем заключить, что вывод обоих браузеров правильный, и что Firefox (Firebug) показывает неверное представление унаследованных стилей. Что говорит CSS-спецификация ?
Наследование передаст
list-style
значения от OL
и UL
элементы к LI
элементам. Это
рекомендуемый способ указать стиль списка
информация.
Не так много о наследовании ol
свойств ul
s. Является ли Firebug неправильным в этом отношении, или вложенные ul
s наследуют (некоторые) свойства от ol
s (и если да, то почему элементы не отображаются соответственно в двух совершенно разных браузерах)? Чтобы быть ясным, мой фактический вопрос: какие свойства должны вложенные ul
элементы наследовать от ol
элементов, которые их заключают?
РЕДАКТИРОВАТЬ: Я забыл об Opera, и картинка становится еще более четкой, если посмотреть на инспектор этого браузера:
Как показывает правая панель, вложенные элементы ul
наследуют свойства от элементов ol
, но значения по умолчанию в браузере list-style-type
и list-style-position
переопределяют значения, указанные его родителем.
Поскольку Vinhboy поддерживает мое подозрение, что это где-то ошибка (Firefox? Firebug?), Я подал отчет об ошибке .
Кстати, мне удалось позволить маркерам исчезнуть, просто изменив строку 312 style.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><ol>/<ul> 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's have some fun with a nested <ul>:
<ul>
<li>First item</li>
<li>And the second one again (this is incredibly boring, but it's 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
.