Question

我对媒体查询有疑问。我有一个网站，我用Breakpoints Tester看到它 http://breakpointtester.com/

我制作的图片的宽度是网站看到的，现在是一些css媒体查询的时间。

<div class="bwpb-column bwpb-video-holder backgr vertical-col-align bwpb-colwidth-4 " style="color: rgb(255, 255, 255); text-align: inherit; width: 100%; min-height: 611px; height: 375px; background: url(http://www.tfeditor.com/wp-content/uploads/2015/11/XXL-02.png) 50% 100% no-repeat rgb(255, 255, 255);"><div class="bwpb-overlay" style="background-color:rgba(255,255,255,0.01)"></div><div class="bwpb-column-inner" style="padding: 0px 15px; margin-top: 305.5px;"></div></div>

我正在努力做到这一点

http://jsfiddle.net/kwstasna/habpmjuw/

但媒体查询无效，当我再次使用断点时，它只显示相同的照片。

有人可以解释我为什么吗？非常感谢！

Answer 1

在最大宽度属性之后你有分号。

在：

@media screen and (min-width: 1281px) and  (max-width:1600px;) {

后：

@media screen and (min-width: 1281px) and  (max-width:1600px) {

JSFiddle

Answer 2

试试这个：

@media only screen and (min-device-width : 1281px) and (max-device-width : 1600px) { 

    // your css code 

    }

媒体查询网站图像

2 个答案: