CSS背景图片不显示。这是我的html代码:
<div class="container-fluid p-c b-g"> <div class="row"> <div class="col-sm-12 text-infom"> </div> </div> </div> </div>
CSS代码
.b-g{ background-image: url(../images/bg/trading.jpg); width: 100%; }
9udxz4iz1#
添加一些高度到div它会显示
.b-g{ background-image: url(https://pbs.twimg.com/profile_banners/1285511592/1470391779/1500x500); background-size: contain; background-repeat: no-repeat; height: 300px; }
<div class="container-fluid p-c b-g"> <div class="row"> <div class="col-sm-12 text-infom"> </div> </div> </div>
cmssoen22#
可能是你保存的文件路径错误,请在浏览器中检查文件是否加载。
<style type="text/css"> .b-g { background-image: url("http://tipsforbeauties.com/gallery_gen//5c5f13b27a80afa16ca4184aec9a26c1_324.7619047619x220.jpg"); width: 100%; } </style> <div class="b-g"> </div>
l5tcr1uw3#
使图像适合背景(元素、主体或其他):
.b-g { padding: 0px; background-image: url(../images/bg/trading.jpg); width: 100%; height: 100vh; background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; }
或者您可以添加background-size属性(删除width属性)。
background-size
width
background-size: 100% 100%;
最后一个你可以这样使用:
background-image: #000 url('../images/bg/trading.jpg') repeat center center;
3条答案
按热度按时间9udxz4iz1#
添加一些高度到div它会显示
cmssoen22#
可能是你保存的文件路径错误,请在浏览器中检查文件是否加载。
l5tcr1uw3#
使图像适合背景(元素、主体或其他):
或者您可以添加
background-size
属性(删除width
属性)。最后一个你可以这样使用: