适用于所有不同UL用途的CSS样式

Question

ul标签非常通用，我不断努力。

最初我为我的ul和li标签定义了一个基本样式规则，用于处理我的通用文本块中用于所见即所得文本的项目符号。 我正在使用BEM所以我想我只会向任何具有不同角色的ul添加一个类（说一个菜单，或一个新闻缩略图列表等等。）

问题是我并不总是控制标记;我目前的问题是使用ul/li结构的分页插件，但不允许我向ul添加一个类。

我正在使用BEM所以我真的不想使用后代选择器，特别是元素选择器，但我意识到当我无法访问ul/li标记时我可能需要这样做。

任何建议都会受到赞赏 - 特别是基本/休息规则，因为我ul/li列出了这么多网站中的所有地方，并且一劳永逸地想要掌握这个问题。

由于

Answer 1

解决方案：

• 使用CSS reset;
重置ul / li的样式
• 在BEM原则中设置例外，并对格式化文本使用级联。例如：

CSS：

.text ul {
    list-style: circle;
}
.text li {
    margin: .5em 1em;
}
.text p {
    margin-bottom: 1em;
}
/* etc. */

HTML：

<div class="text">
    <p>Here all the text is formatted</p>
</div>

Answer 2

我同意@Tarh

所以这一直是WordPress主题开发者。所有内容区域都获得了无法附加类的通用元素。所以你有两个解决方案：

1. 与上面描述的Tarh一样，您使用重置来终止UL / LI上的所有样式，并且您只使用BEM在整个站点中设置样式。但是，当您到达不允许您向元素添加类的内容区域时，您只需将整个内容区域包含在您喜欢的BEM类的div中，然后按照上述步骤操作。

2.在WP中有一些知道方法可以解决这个问题，但它需要编写一些函数。你可以read about how to do this here。基本上，您可以隐藏格式下拉列表，然后隐藏隐藏的默认“段落/标题”下拉列表。然后，您可以根据需要格式化通用元素。像：

array(
  'title' => 'Large heading',
  'block' => 'ul',
  'classes' => 'content__list'
)

但我不知道你是否真的指的是WP的东西，所以我只想在这里结束。

祝你好运！保持棒极了！