Question

有没有一种简单的方法可以用CSS选择所有块级元素？

我想在我网站的主要内容区域中的所有块级元素之间加上1.5 em边距

现在我的代码如下：

#wrapper .content p, #wrapper .content ul, #wrapper .content div, #wrapper .content ol, #wrapper .content blockquote, #wrapper .content table {margin-top: 1.5em;}

#wrapper .content p:first-child, #wrapper .content ul:first-child, #wrapper .content div:first-child, #wrapper .content ol:first-child, #wrapper .content blockquote:first-child, #wrapper .content table:first-child {margin-top: 1.5em;}

后面的王室痛苦是阅读或维护......

我想用以下内容替换它：

#wrapper .content *:block + *:block {margin-top: 1.5em;}

这可能吗？

我无法使用* + *，因为它还会捕获内联元素，表格单元格等，并且我不希望在段落中间应用随机边距。我也无法使用#wrapper .content > *，因为它无法获得嵌套div等。

Answer 1

CSS无法实现这一点;您无法根据其CSS属性之一选择元素。您需要使用JavaScript来选择所有带有getComputedStyle或类似内容的元素，然后根据找到的内容运行一些脚本逻辑。

您在CSS中最接近的是选择HTML 属性; href或title之类的内容。

Answer 2

.positiones {
  display: flex;
  height: 100vh;
  align-items: center;
  justify-content: center;
}

不确定我是否错过了一个要素，但是您明白了。我认为应该可以。

Answer 3

@tylerh回答是正确的，不可能以你要求的方式激活纯CSS。

使用css的一种可能的解决方法是创建一个通用的css类来处理块级元素，如.block-element

然后使用

应用边距样式

#wrapper .content .block-element { margin-top: 1.5em; }

Answer 4

有没有一种简单的方法可以用CSS选择所有块级元素？

默认情况下，非块元素忽略边距。所以你回答了你的问题。

使用css选择所有块级元素

4 个答案: