Вопрос

В глобальной таблице стилей, используемой на всех наших страницах, находится следующая строка:

ul { margin: 0; }
li { list-style-type: none; padding-bottom: 3px; }

Таким образом, любые ul на моих страницах отображаются без дисков рядом с li.

Однако в особых случаях мне нужно отобразить диск рядом с символом li.

У меня есть div с классом "blog-post", и, несмотря на это, следующее помогло бы мне.

.blog_body ul { list-style-type: disc; }
.blog_body ol { list-style-type: decimal; }

Однако это не помогает.

Итак, со следующим фрагментом HTML

<ul>
  <li>Testing</li>
</ul>
<ol>
  <li>Testing</li>
</ol>

Результаты с:

Testing
1. Testing

По-прежнему нет диска в li, вложенного в ul.Мысли о том, как я могу доставить их туда?Мой CSS-fu слаб....

Это было полезно?

Решение

!important не является необходимым, поскольку стили, зависящие от класса, уже переопределяют глобальные стили.Проблема в том, что в глобальном стиле вы устанавливаете поле равным нулю.Тип стиля отображается правильно, но вы просто не можете его видеть.Это должно сработать для вас:

.blog_body ul 
{
    list-style-type: disc; 
    margin: 1em;
}

Другие советы

Измените это:

.blog_body ul { list-style-type: disc; }
.blog_body ol { list-style-type: decimal; }

к этому:

.blog_body ul li { list-style-type: disc; }
.blog_body ol li { list-style-type: decimal; }
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top