划分背景图像，没有内容不显示百分比声明

Question

我想显示带背景图片的div。我不希望div有任何其他内容而不是背景图像，我不想使用img代替。

它可以使用固定值，如height：100px，但我想使用百分比声明。 为什么没有显示？是否可能使用百分比值？或者我必须申报其他任何内容吗？

我想建立一个RESPONSIVE移动网站，在那里我可以使用模板按钮并用html文本填充它，所以我不需要使用多个图像用于具有不同文本的相同按钮。还有更好的方法吗？

在此先感谢我的代码：

<div id="icon1">

</div>

 #icon1 {
   background-image: url(images/MyPicture.png);
   width: 30% ;
   height: 100%;
}

Answer 1

只有将百分比高度设置为DIV＃icon1的所有父元素，直到BODY和HTML标记才能生效。

http://fiddle.jshell.net/YJQcF/1/

否则，它需要分配固定高度或最小高度值;