这些照片为什么不缩放?

时间:2019-02-16 20:29:05

标签: html css

我正在使用模板,正在处理几页。每页顶部都有一个照片部分。当我将图像放入css类中时,图像非常巨大,并且无法缩放到框架。

图片位于ID标签#subheader中。

此模板的所有其他照片部分都可以正常工作,并且所有缩放比例都完美。我不明白为什么会在这里发生。

在此处显示其外观照片。这是图像的左上方 photo

    #subheader {padding-bottom: 70px;
                background: #222;background:url(file:///Users/Nineborn/Desktop/New%20LW%20Construction%20Site/shutterstock_134687783.jpg)top fixed;}
     <!-- subheader -->
      <section id="subheader">
        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <h1>
                About Us
              </h1>
            </div>
            
            <!-- devider -->
            <div class="col-md-12">
              <div class="devider-page">
                <div class="devider-img-right">
                </div>
              </div>
            </div>

            <div class="col-md-12">
              <ul class="subdetail">
                <li>
                  <a href="index.html">Home</a>
                </li>

                <li class="sep">/
                </li>

                <li>About
                </li>
              </ul>
            </div>
          </div>
        </div>
      </section>
      <!-- subheader end -->

  

2 个答案:

答案 0 :(得分:0)

我以前做过,希望这对您有用

background: url("--YOUR IMAGE HERE--") 50% 0% / cover no-repeat scroll padding-box border-box rgba(0, 0, 0, 0);

答案 1 :(得分:0)

您可以尝试类似的方法,然后套用封面尺寸

#subheader {
    padding-bottom: 70px;
    background: url(./img7.jpg);
    background-size: cover;
    background-repeat: round;
}