it-swarm.com.ru

Что такое стиль списка по умолчанию (CSS)?

На моем сайте я использую reset.css. Это добавляет именно это к списку стилей:

ol, ul {
    list-style: none outside none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    font-size: 100%;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
}

Проблема в том, что все стили списка установлены на NONE с этим. Я хочу вернуть исходные стили списка (по умолчанию) для всех списков только на подстраницах веб-сайта (все списки в .my_container).

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

Есть ли способ наследовать стили исходного браузера для определенных свойств без изменения файла reset.css?

81
Atadj

Я использовал этот CSS для удаления сброса:

ul { 
   list-style-type: disc; 
   list-style-position: inside; 
}
ol { 
   list-style-type: decimal; 
   list-style-position: inside; 
}
ul ul, ol ul { 
   list-style-type: circle; 
   list-style-position: inside; 
   margin-left: 15px; 
}
ol ol, ul ol { 
   list-style-type: lower-latin; 
   list-style-position: inside; 
   margin-left: 15px; 
}

Правка: с определенным классом, конечно ...

129
zessx

Я думаю, что это на самом деле то, что вы ищете:

.my_container ul
{
    list-style: initial;
    margin: initial;
    padding: 0 0 0 40px;
}

.my_container li
{
    display: list-item;
}
31
ColdCold

Согласно документации, большинство браузеров будут отображать элементы <ul>, <ol> и <li> со следующими значениями по умолчанию:

Настройки CSS по умолчанию для тега UL или OL :

ul, ol { 
    display: block;
    list-style: disc outside none;
    margin: 1em 0;
    padding: 0 0 0 40px;
}
ol { 
    list-style-type: decimal;
}

Настройки CSS по умолчанию для тега LI :

li { 
    display: list-item;
}

Стиль вложенных элементов списка также:

ul ul, ol ul {
    list-style-type: circle;
    margin-left: 15px; 
}
ol ol, ul ol { 
    list-style-type: lower-latin;
    margin-left: 15px; 
}

Примечание: Результат будет идеальным, если мы будем использовать вышеуказанные стили с классом. Также см. Различные маркеры List-Item .

9
Reza Mamun

http://www.w3schools.com/tags/tag_ul.asp

ul { 
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}
9
jerrygarciuh

Ты не можешь. Всякий раз, когда применяется какая-либо таблица стилей, которая присваивает свойство элементу, невозможно получить настройки браузера по умолчанию для любого экземпляра элемента.

(Спорная) идея reset.css состоит в том, чтобы избавиться от настроек браузера по умолчанию, чтобы вы могли начать свой собственный стиль с чистого стола. Никакая версия reset.css не делает этого полностью, но в той степени, в которой они это делают, автор, использующий reset.css, должен полностью определять рендеринг.

4
Jukka K. Korpela

Вы сбрасываете поля для всех элементов во втором блоке CSS. По умолчанию поле составляет 40px - это должно решить проблему:

.my_container ul {list-style:disc outside none; margin-left:40px;}
2
OmidAntiLong

Ответ на будущее: CSS 4, вероятно, будет содержать ключевое слово revert, которое возвращает свойство к его значению из таблицы стилей пользователя или агента пользователя [ source ]. На момент написания этого, только Safari поддерживает это - проверьте здесь для обновления поддержки браузера.

В вашем случае вы бы использовали:

.my_container ol, .my_container ul {
    list-style: revert;
}

Смотрите также этот другой ответ с некоторыми более подробной информацией.

0
tanius