99

在我的网站上,我使用 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的情况下继承某些属性的原始浏览器样式?

4

7 回答 7

167

我曾经设置这个 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; 
}

编辑:当然有一个特定的课程......

于 2012-07-31T09:47:27.610 回答
35

我认为这实际上是您正在寻找的:

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

.my_container li
{
    display: list-item;
}
于 2013-04-18T00:12:55.977 回答
13

根据文档,大多数浏览器将显示<ul>,<ol><li>具有以下默认值的元素:

ULOL标签的默认 CSS 设置:

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

LI标签的默认 CSS 设置:

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; 
}

注意:如果我们将上述样式与类一起使用,结果将是完美的。另请参阅不同的列表项标记。

于 2017-12-17T09:53:14.377 回答
11

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;
}
于 2014-12-22T18:58:18.010 回答
4

你不能。每当应用任何将属性分配给元素的样式表时,对于元素的任何实例,都无法获取浏览器默认值。

reset.css 的(有争议的)想法是摆脱浏览器默认设置,以便您可以从干净的办公桌开始自己的样式。没有任何版本的 reset.css 可以完全做到这一点,但就他们所做的而言,使用 reset.css 的作者应该完全定义渲染。

于 2012-07-31T13:50:28.347 回答
3

未来的答案:CSS 4 可能包含 revert 关键字,它将属性恢复为它从用户代理样式表或用户样式(或从父级继承的值,如果存在)具有的初始值[来源]。

在撰写本文时,只有 Safari 支持此功能 -请在此处查看有关浏览器支持的更新。

在您的情况下,您将使用:

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

另请参阅this other answer了解更多详细信息。

于 2016-12-17T18:46:39.980 回答
2

您正在重置第二个 CSS 块中所有元素的边距。默认边距为 40px - 这应该可以解决问题:

.my_container ul {list-style:disc outside none; margin-left:40px;}
于 2012-07-31T09:52:39.900 回答