無法更改HTML中特定部分的背景圖像

我對HTML & CSS相當陌生。我最近從bootstrap下載了一個主題，我試圖更改一個section/div的背景圖片。我不僅嘗試向CSS添加代碼，而且還將背景圖片引用包含在我的html代碼中。但我仍然無法改變背景。該圖像是一個.jpg。無法更改HTML中特定部分的背景圖像

下面是HTML代碼的特定部分：

<!-- About Section --> 
<section class="success" id="about" style="background-image:parallax.jpg;"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-lg-12 text-center"> 
       <h1>About</h1> 
       <!-- <img class="img-responsive" src="new.gif" alt="" align="middle" align ="center" style="margin-left:auto; margin-right:auto"> --> 
       <br> 
      </div> 
     </div> 
     <div> 
      <div> 
       <p align="left" style="font-family: 'Abel', sans-serif;" > Hello.</p> 
      </div> 
      <div class="col-lg-8 col-lg-offset-2 text-center"> 
       <a href="Website Resume.pdf" class="btn btn-outline" style="font-family:'Shadows Into Light', cursive;"> 
        <i style="font-family:'Shadows Into Light', cursive; text-align: center;"></i> Check Out My Resume! 
       </a> 
      </div> 
     </div> 
    </div> 
</section>

這裏是CSS代碼：

section.success { 
    color: #000000; 
    background: #ffffff; 
} 

#about{ 
    background-image: url("parallax.jpg") no-repeat center center fixed; 
    background-size: cover; 
    height: 300%; 
    width: 100%; 
}

來源

2015-04-12 Shashank

圖像存儲在哪裏與您的HTML和CSS文件有關？你的控制檯中是否有404錯誤？ – Turnip

嗨！我沒有看到任何404錯誤。這些圖像與index.html文件位於相同的文件夾中。 – Shashank

請注意，您在您的HTML寫的內聯CSS是無效的，它應該是：

background-image: url("parallax.jpg");

同樣，CSS屏幕ä TE在樣式表是無效的，它應該是：

background-image: url("parallax.jpg") !important; 
background-repeat: no-repeat; 
background-position: center center; 
background-attachment: fixed; 
background-size: cover;

或者

background: transparent url("parallax.jpg") no-repeat fixed center center !important; 
background-size: cover;

參考：https://developer.mozilla.org/en-US/docs/Web/CSS/background-image

來源

2015-04-12 14:49:19

你的第一個例子應該是...

style="background-image: url(parallax.jpg);"

假設你的CSS文件在根目錄下，你的代碼應該是b è...

background: url(parallax.jpg) no-repeat center center fixed;

來源

2015-04-12 14:50:36 Turnip

你的背景可能會得到覆蓋其他地方。強制圖像添加！對樣式很重要。將CSS更改爲...

background: transparent url("parallax.jpg") no-repeat fixed center center !impotant; 
background-size: cover !impotant;

這告訴瀏覽器使用它來覆蓋任何其他聲明。

來源

2015-04-12 15:07:52

無法更改HTML中特定部分的背景圖像

回答

相關問題