html - 背景图像不显示完整图像

Question

我一直在尝试修复我的背景图片，以便完整图片显示其完整尺寸。截至目前的图像显示，但它看起来像是放大了。我玩过 css 并多次调整图像大小但没有任何效果。当前使用此模板:http://www.tooplate.com/view/2076-zentro

HTML:

    <!-- home section -->
    <section id="home" class="parallax-section">
        <div class="container">
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <h1>Cozinha Bomtempo</h1>
                    <h2>CLEAN &amp; SIMPLE DESIGN</h2>
                    <a href="#gallery" class="smoothScroll btn btn-  default">LEARN MORE</a>
                </div>
            </div>
        </div>      
    </section>

CSS:

    #home {
      background: url('../images/telma1.jpg') 50% 0 repeat-y fixed;
      -webkit-background-size: cover;
      background-size: cover;
      background-position: center;
      color: #ffffff;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      height: 100vh;
      text-align: center;
    }

Answer 1

覆盖和包含调整图像大小以适合窗口。要真正成为全尺寸，您需要

background-size: [image width]px [image height]px;

要始终适应父元素，请使用

background-size: 100% 100%;