的WordPress：做響應的背景圖像

這裏是我的wordpress：如果你看看它在桌面模式，但有一個在智能手機模式的問題http://shopmanouchek.com 的WordPress：做響應的背景圖像

一切正常。標題圖片不響應。

下面是標識代碼：

#header{ 
background-image: url(http://img15.hostingpics.net/pics/989373manouchekc.png); 
background-repeat: no-repeat; 
background-position: center; 
}

我嘗試添加

-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover;

它看起來我的手機就OK了，但現在在桌面視圖中的標誌現在已經完全超大

來源

2014-12-02 Dylan Mura

你想要什麼？ – 2014-12-02 19:22:14

我不想更改桌面視圖的大小，但我想讓它完全顯示在智能手機模式中。我嘗試使用包含替換封面，但它也在桌面上稍微改變了大小 – 2014-12-02 19:29:27

使用媒體查詢爲桌面和移動設備定義單獨的規則。 – 2014-12-02 19:34:18

Salman A上面已經提到過媒體查詢，這裏是一個簡要的概述http://css-tricks.com/css-media-queries/

以及如何在實踐中工作的示例

#header { 
    background-image: url(http://img15.hostingpics.net/pics/989373manouchekc.png); 
    background-repeat: no-repeat; 
    background-position: center; 
} 

@media all and (max-width: 480px) /*or whatever width you want the change to take place at*/ { 
    #header { 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 
}

來源

2014-12-03 01:22:40 JSilv

的WordPress：做響應的背景圖像

回答

相關問題