HTML中的奇怪行爲頁面

我正在編寫一個Web應用程序，並且遇到來自我的應用程序的奇怪行爲。HTML中的奇怪行爲頁面

基本上，我設置了一個background-image和網站width繼續通過圖像length。

這裏有一個PRINTSCREEN：

有什麼事糾正呢？

我設置這一行的背景：

<header style="background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(<?php echo base_url('assets/pagina_voluntario.jpg');?>);"> 
     <div class="header-content"> 
      ... 
     </div> 
    </header>

來源

2016-04-25 queryMaster

你寫的代碼是什麼？ – Wowsk

與我們分享您所寫的代碼，以便我們看到您所做的一切。 – JoeL

也許這有助於'background-size：url（「...」）cover'這裏是一個關於你的問題的網站https://css-tricks.com/perfect-full-page-background-image/ –

的background-image的默認行爲是一次展示形象在它的正常大小。如果視口最終大於背景圖像，圖像將不會縮放或重複。

這可以通過background-size: cover固定，使背景「覆蓋」整個空間而不會扭曲背景圖像的比例。

所以，你會設置你的背景圖像的大小是這樣的：

background-image: url(http://...); 
background-size: cover;

並非所有的瀏覽器都支持在CSS的覆蓋，我們（傳統IE及以上Safari瀏覽器的版本，例如），但我溜去回備用方法，您可以在現代的（可能更有效）cover方法的前面加上所以它並不能完全舊版瀏覽器上失敗：

background: url(img2x.jpg) 0% 0%/100%;

（見原答案here）

來源

2016-04-25 18:53:36

HTML中的奇怪行爲頁面

回答

相關問題