2

我知道一个空的 div 并不完全符合语义。但我想知道是否可以将它与背景图像一起使用来创建样式精美的阴影或其他效果来装饰“父”div。

（我也知道如何使用 CSS3 做到这一点，但由于显而易见的原因，这并不总是能奏效）

4

3 回答 3

4

它可能不是很好的样式，但从技术上讲，添加一个空div元素是有效的。

因为div不会添加或更改任何含义，所以使用空div不会干扰文档的语义。

当然，您应该使用 CSS 而不是img元素提供背景图像。

然而，也许你可以使用 CSS 伪元素来实现你想要的 deocationafter呢before？

于 2012-09-15T23:38:56.060 回答
1

如果您想让 html 尽可能干净，那么最好的办法就是，好吧......不要管它并使用 CSS。如何？CSS 为您提供了一种使用两个特殊选择器将 [pseudo] 元素添加到 html 中的方法：:after 和 :before。看看这个小提琴：http: //jsfiddle.net/joplomacedo/ubG5t/

css，如果你在小提琴中看不到它，看起来像下面这样：

body:after {
  content: " ";
  display: block;
  /* your styles */
}

没什么大不了的。它所做的是在 body 元素的最末端（仍在其中）插入一个带有块显示的 [pseudo] 元素 - 就像 div 一样。你可以给它任何你喜欢的风格——再一次，这就像拥有一个普通的 div [1*]

内容的存在是为了让它发挥作用。你可以在里面放一些文本，它会出现在框中，或者你可以像我一样把它留空——但它必须在那里，否则，你就没有 div。

* 1 - 好吧，过渡并不能真正使用它，但除此之外......

于 2012-09-16T00:19:37.437 回答
0 
<style>
.element div:empty{
    background: #red;
    height:15px;
    width:15px;
} 
</style>


<div class="element">
<div>not empty</div>
<div></div>
</div>
于 2016-02-12T09:20:09.053 回答