无法更改背景图片的大小

时间:2017-03-21 01:28:07

标签: html css

我无法获得适合整个窗口的背景

在我网站的某个部分,我得到的结论是:

what i dont want

它应该出现在介绍页面中:

what I want

Bellow是非工作的CSS和HTML代码。



.content-section {
  padding-top: 100px;
}
.download-section {
  width: 100%;
  padding: 50px 0;
  color: white;
  background: url('https://i.stack.imgur.com/8lpZc.jpg') no-repeat center center scroll;
  background-color: black;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
}
#map {
  width: 100%;
  height: 200px;
  margin-top: 100px;
}
@media (min-width: 767px) {
  .content-section {
    padding-top: 250px;
  }
  .download-section {
    padding: 100px 0;
  }
  #map {
    height: 400px;
    margin-top: 1000px;
  }
}

<section id="comojogar" class="content-section text-center">
        <div class="download-section">
            <div class="container">
                <div class="col-lg-8 col-lg-offset-2">
                    <h2>Download Grayscale</h2>
					 <!--<video width="720" height="480" controls="controls">
					 <source src="video/1.mp4" type="video/mp4"> 
					 <object data="" width="720" height="480"> 
					 <embed width="720" height="480" src="video/1.mp4">
					</video>--> 
					
                    <p>You can download Grayscale for free on the preview page at Start Bootstrap.</p>
                    <a href="http://startbootstrap.com/template-overviews/grayscale/" class="btn btn-default btn-lg">Visit Download Page</a>
                </div>
            </div>
        </div>
    </section>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:2)

试试这个:D

.download-section {
  width: 100%;
  padding: 50px 0;
  color: white;
  background: #000 url(../img/fundo1.jpg) no-repeat center;
  background-size: cover !important;
}