的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：做响应的背景图像

回答

相关问题