您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

空或空白的CSS选择器

空或空白的CSS选择器

很多人错过了这个问题的要点,在下面的博览会中我已经解决了这个问题,但是对于那些只想寻找答案的人,我在这里反映了最后一段:

选择器4现在重新定义:empty包括仅包含空格的元素。最初是作为单独的伪类提出的,:blank但是最近:empty确定在没有太多站点的情况下可以这样做是安全的,这取决于原始行为。:empty为了符合选择器4,浏览器将需要更新其实现。如果需要支持较旧的浏览器,则必须经历标记元素仅包含空格的麻烦,或者在事实之前或之后进行修剪。

虽然问题描述的<p>元素包含少数规则的空格字符,这似乎是一个疏忽,但在标记中元素仅包含空格的缩进和空白行的情况下,这种情况更为普遍,例如:

<ul class="items">
  <li class="item">
    <div>
      <!-- Some complex structure of elements -->
    </div>
  </li>
  <li class="item">
  </li> <!-- Empty, except for a single line break and
             indentation preceding the end tag -->
</ul>

某些元素(如<li>上述示例中的以及<p>)具有可选的结束标签,这些元素可能会在DOM处理以及元素间空白的存在下引起意外的副作用。例如,以下两个<ul>元素不会产生等效的节点树,特别是第一个元素不会li:empty在Selectors级别产生a :

li:empty::before { content: '(empty)'; font-style: italic; color: #999; }


<ul>

  <li>

</ul>

<ul>

  <li></li>

</ul>

鉴于HTML认为元素间空格在设计上是透明的,因此使用CSS定位此类元素而不用诉诸于修改HTML或生成它的应用程序(尤其是如果最终必须实现和测试只是这样做)。为此,选择器4现在重新定义:empty包括仅包含空格的元素。最初是作为单独的伪类提出的,:blank但是最近:empty确定在没有太多站点的情况下可以这样做是安全的,这取决于原始行为。浏览器将需要更新其实现:empty为了符合选择器4。如果需要支持较旧的浏览器,则必须经历标记元素仅包含空格的麻烦,或在事实之前或之后修剪空格。

CSS 2022/1/1 18:21:29 有315人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶