的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了,但现在在桌面视图中的标志现在已经完全超大
答
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-02 19:22:14
我不想更改桌面视图的大小,但我想让它完全显示在智能手机模式中。我尝试使用包含替换封面,但它也在桌面上稍微改变了大小 – 2014-12-02 19:29:27
使用媒体查询为桌面和移动设备定义单独的规则。 – 2014-12-02 19:34:18