移動瀏覽器中的CSS背景標題不可靠

Question

有人可以看看這個頁面，看看你是否知道如何解決這個問題。

Original page link

此頁適用於桌面版Chrome和Firefox瀏覽器。它甚至可以在開發人員預覽上響應移動480px。

但是，如果您在手機或平板電腦上查看此頁面，則標題背景和模糊不清。沒有對齊，並且不像在桌面上那樣滾動圖像。

我的猜測是某些CSS在手機瀏覽器上不支持。是這樣嗎？

請幫助解決這個問題。 感謝

這裏是JS Fiddle

.title_EService { 
    background: url(http://advantageaccountants.com.au/image/e_service_header.jpg) fixed center 3.67em no-repeat; 
    width: 100%; 
    height: 200px; 
    position: relative; 
    overflow: hidden; 
} 

.title_EService > header { 
    position: absolute; 
    bottom: 0px; 
    left: 0px; 
    width: 100%; 
    padding: 20px 30px; 
    background: inherit; 
    background-attachment: fixed; 
    overflow: hidden; 
} 

.title_EService > header::before { 
    content: ""; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 200%; 
    height: 200%; 
    background: inherit; 
    background-attachment: fixed; 
    -webkit-filter: blur(4px); 
    filter: blur(4px); 
} 

.title_EService > header::after { 
    content: ""; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0, 0, 0, 0.25) 
} 

.title_EService > header > h1 { 
    font-weight: bold; 
    margin: 0; 
    color: white; 
    position: relative; 
    z-index: 1; 
} 

Answer 1

林無親，但是當我看着你的CSS我想也許在固定的高度可能是烏拉圭回合問題上的類（.navbar）本身同裕，我沒有看到任何調整它的移動特別代碼。

.navbar { 
    position: relative; 
    min-height: 50px; */ 
    margin-bottom: 20px; */ 
    border: 1px solid transparent; 
}