Question

我在我的rails应用reset.css中有

ul, ol, li { list-style: none; }

但我不想在某些页面上使用它，我想保持默认（默认的CSS样式）

如何为其设置默认值？

我的div与列表

 <div class="text_blog">
    <ol>
     <li>1</li>
     <li>2</li>
     <li>3</li>
    </ol>
   </div>

可以是ol或ul列表

Answer 1

您确定要重置样式吗？我想你想要定位特定的HTML元素！

我的意思是，不是针对所有列表（ul，ol），而是仅针对那些要删除列表样式的目标！

在您的代码中，类.text_blog内的代码。

您的HTML应如下所示：

 <div class="text_blog">
  <ol>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ol>
 </div>

 <div>
   <ol>
     <li>1</li>
     <li>2</li>
     <li>3</li>
   </ol>
 </div>

你的CSS：

.text_blog ol {
    list-style: none;
}

请注意，第一个div具有类.text_blog，因此CSS仅针对特定div。

小提琴：https://jsfiddle.net/r1xefz1q/

编辑：如果要定位列表元素，则div不会将class属性移动到list元素。将class属性应用于要覆盖样式的所有列表！

这样就适用于不同的名单！

如果这意味着你必须通过所有列表更新他们的课程，我会接受这份工作，以保持你的代码可读和易懂！：）

HTML：

 <div class="text_blog">
  <ol class="customListStyle">
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ol>

  <ul class="customListStyle">
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>
</div>

<div>
  <ol>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ol>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>
</div>

CSS：

.customListStyle {
    list-style: none;
}

新小提琴：https://jsfiddle.net/r1xefz1q/1/

Answer 2

我尝试了所有方法，但我似乎只是想弄清楚，如果你从原始版本中移除ul, li并在.text-blog ol上放置initial 那种 em>工作。好运！

.text_blog ol { list-style: initial; } ol { list-style:none; }

<div class="text_blog"> <ol> <li>1</li> <li>2</li> <li>3</li> </ol> </div> <div class="second"> <ol> <li>1</li> <li>2</li> <li>3</li> </ol> </div>

Answer 3

您可以使用list-style css属性来设置默认样式。

＆＃13;

.text_blog ol {
    list-style-type: numeric;
}

＆＃13;

<div class="text_blog">
    <ol>
       <li>1</li>
       <li>2</li>
       <li>3</li>
    </ol>
</div>

＆＃13;

Css覆盖列表样式

3 个答案: