CSS可以检查元素是否中断？

有没有办法检查（在CSS中）如果一个元素正在打破/新衬里？我无法知道div或父级的宽度。我只是想知道破发后的第一个元素，这样我就可以给这个元素CSS可以检查元素是否中断？

像这样添加特殊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; 
}

来源

2012-08-16 Arazu

我相信你正在寻找['text-indent']（https://developer.mozilla.org/en-US/docs/CSS/text-indent）CSS属性。\ – 2012-08-16 10:36:20

你是什么人用'div：不是（：first）'来表示？ '：first'不存在，'：not'支持仍然相当脆弱（特别是IE <9不支持）。你究竟在哪里知道它正在破裂。如果两者都浮动，那么在div或div之间？ – RoToRa 2012-08-16 10:38:53

我居然做了一个错字，我应该是：第一，孩子 – Arazu 2012-08-16 10:49:02

不，我不认为这是一种用CSS来做你想问的问题。

一个DIV会自动占用它父母的全部宽度，除非指定了一个宽度，因为它是一个BLOCK级别的元素，所以如果没有指定宽度，那么您的第二个DIV就会在新行上。

来源

2012-08-16 10:36:40

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

来源

2012-08-16 10:41:55

我加了一些更多的解释，因为它不清楚是什么我真的很想 – Arazu 2012-08-16 11:02:54

是否第一行实际上在块级元素上工作？ – Lg102 2012-08-16 11:45:59

@ Lg102它*仅适用于块级元素，因为伪元素应用于包含多行的元素，而不是这些行中的元素。 – 2012-08-16 11:47:45

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

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

来源

2012-08-16 12:07:46 Lg102

这确实解决了我的问题，但正如你所说，它并没有放弃我真正想用这个达到的目标。 – Arazu 2012-08-16 14:58:22

CSS可以检查元素是否中断？

回答

相关问题