背景未覆蓋整頁

當我輸入我的導航欄時，我的背景圖像沒有覆蓋整個頁面。我已將背景寬度和高度設置爲100％，我認爲這可以解決問題。背景未覆蓋整頁

CSS

#intro { 
    background: #151515 url(../img/b1.jpg) no-repeat center bottom; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    background-size: 650px; 
    background-attachment: fixed; 
    width: 100%; 
    height: 100%; 
    min-height: 720px; 
    display: table; 
    position: relative; 
    text-align: center; 
} 

.intro-overlay{ 
    position:absolute; 
    top: 0; 
    left: 0; 
    height: 100%; 
    width: 100%; 
    background: #111111; 
    opacity: .85 
}

HTML

<nav> 
    <a href="#about">about me</a> 
    <a href="#my parents">about my parents</a> 
    <a href="#hobbies">My hobbies</a> 
    </nav> 

<body> 


    <section id="intro"> 
     <div class="intro-overlay"></div> 
      <div class="intro-content"> 
       <h5>Oh, hi there! My name is Tatsu</h5> 
       <h1> (Tah-T-Su)</h1> 
       <a class="button stroke smoothscroll" href="#about" title="about me button">find out more about me</a> 
</div>

來源

2017-07-06 Rorix

是否更換主背景覆蓋屬性的「650像素」與「蓋」不行？我無法在JSFiddle中輸入任何內容進行驗證。＃'intro' div id中的 –

。將'position：relative;'改成''position：absolute;' – Jorden1337

試試這個

html { 
      background: url(xyz.jpg) no-repeat center center fixed; 
      -webkit-background-size: cover; 
      -moz-background-size: cover; 
      -o-background-size: cover; 
      background-size: cover; 
     } 
    body 
     { 
     background:none; 
     }

這肯定會起作用。

來源

2017-07-06 16:28:14

您的代碼與您的小提琴不匹配。問題在於你沒有將整個頁面的背景添加到#intro元素中。有這<section>之外的副本。

添加到您的小提琴，它會延伸到整個頁面：

body { 
    background: #151515 url(../img/b1.jpg) no-repeat center bottom; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    background-size: 650px; 
    background-attachment: fixed; 
}

來源

2017-07-06 19:06:06 rideron89

背景未覆蓋整頁

回答

相關問題