如果< div>是空的? [英] background-image doesn't appear if <div> is empty?

查看:125
本文介绍了如果< div>是空的?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在< body> 中创建了一个< div> 页面顶部:

I created a <div> first thing in the <body> to draw a top line at the top of the page:

<body>
    <div class="bordertop"></div>
    .....
</body>

和样式:

body {
    font-family: Helvetica, Arial, sans-serif;
    -webkit-text-size-adjust: 100%;
    margin:0;
}
.bordertop {
    background-image: url(../images/top_border.png);
    background-repeat: repeat-x;    
}

但是, top_border image 不会出现,除非我在< div> 里面写一些文本,但我不想。

However, the top_border image doesn't appear unless I write some text inside the <div> but I don't want to. How could I fix this?

推荐答案

由于div是空的,没有内容推动它打开是0px高。在div上设置显式尺寸,您应该会看到背景图片。

Since the div is empty, there's no content to push it "open" leaving the div to be 0px tall. Set explicit dimensions on the div and you should see the background image.

.bordertop 
{
    background-image: url(../images/top_border.png);
    background-repeat: repeat-x;    
    height: 100px;
    width: 100%; /* may not be necessary */
}

这篇关于如果&lt; div&gt;是空的?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆