Question

在iOS设备上，背景图像显得模糊。如果有人可以指出我需要做什么，这将是伟大的。我也是新手，所以请解释一下。

#home-cover {
    height: 100%;
    background-image: url("../img/bg-home.jpg");
}

<!DOCTYPE html>
<html lang="en">

<head>

    <!-- required meta tags -->
    <meta charset="utf-8">
    
    <meta name="description" content="Building modern responsive website with html5, css3, jQuery & bootstrap framework">
    <meta name="keywords" content="HTML5, CSS3, jQuery, Bootstrap, Web Design, Web Development, Responsive website, Modern website">
    
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- title -->
    <title>Genesis Utility</title>
    
  
     <!-- Home -->
    <section id="home">

        <div id="home-cover" class="bg-parallax animated fadeIn">

            <div id="home-content-box">

                <div id="home-content-box-inner" class="text-center">

                    <div id="home-heading" class="animated zoomIn">
                      <h3>Genesis Utility <br> Communication Inc.</h3>
                    </div>
                    <div id="home-btn" class="animated zoomIn">
                        <a class="btn btn-lg btn-general btn-white smooth-scroll" href="#about" role="button" title="View Our Work">Learn About Us</a>
                    </div>

                </div>

            </div>

        </div>

    </section>

Answer 1

您尚未设置背景尺寸属性。假设根据您的设计，您需要封面

#home-cover {
    height: 100%;
    background-image: url("../img/bg-home.jpg");
    background-size: cover;
}

网站上的背景图片在iOS上显得模糊

1 个答案: