Question

有没有办法检查（在CSS中）元素是否破坏/新衬里？我不知道div或父母的宽度。我只想知道休息后的第一个元素，所以我可以为这个元素添加特殊的CSS

像这样：

<div>
  first
</div>    
<div>
  second
</div>  
<div>
  third
</div>  
<div>
  fourth
</div>

css：

div {
    float:left;
    width:200px;
    height:20px;
}
div:not(:first-child) {
    padding-left:10px;
}

这里我需要检查元素是否在新行上，这样我就可以删除填充：

div:first-after-break {
    padding-left:0;
}

Answer 1

我认为在这种情况下，您可以使用padding-right分隔元素而不是padding-left来实现此目的。这样，元素在新行开始时不会缩进。如果padding-right在行尾导致问题，您可以考虑使用:last-child伪选择器（more information about :last-child），并在那里设置padding-right: 0;。

但这并没有抛弃这个问题。我可以想到你描述的:first-after-break伪的合法用法。例如：使用浮动块级元素的完全响应式布局。在这种情况下，人们可能想知道元素是否在窗口的左侧。

Answer 2

您可以使用::first-line伪元素来获取div的第一行。如果要将样式规则应用于不第一行的行，可以将这些样式应用于整个元素，然后将其从第一行中删除。但是如果你想专门使用padding属性，你也可以在整个元素上设置text-indent（没有任何伪元素）。

Answer 3

不，我认为CSS中没有办法做你要问的事。

除非指定宽度，否则DIV会自动占据其父级的全宽，因为它是BLOCK级别元素，所以如果没有指定宽度，那么你的第二个DIV无论如何都会在新行上。

CSS可以检查元素是否破裂？

3 个答案: