我应该使用什么(最小设备宽度)和(最小宽度)?

时间:2016-10-29 18:05:48

标签: html css responsive-design

我正在对RWD(响应式网页设计)进行一些测试,并正在搜索最常见的断点。我偶然发现了这个:

Stream iconStream = Application.GetResourceStream( 
            new Uri( "pack://application:,,,/YourReferencedAssembly;component/YourPossibleSubFolder/YourResourceFile.ico" )).Stream;
            notifyIcon.Icon = new System.Drawing.Icon(iconStream);

我尝试调整浏览器窗口的大小(使用Chrome),发现除了具有@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { body { background-color: #7763a5; } } @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { body { background-color: #011C40; } } @media only screen and (min-width : 1224px) { body { background-color: #3957FC; } } 属性的样式外,没有任何样式生效。

为什么会发生这种情况?如何测试便携式设备样式?另外,可以为其他设备编写条件语句吗?

(min-width : 1224px)

因为针对桌面的最后一个是在没有“设备”部分的情况下编写的,在其他声明中提到过。

我查看了这个问题difference between max-width and max-device-width。公平地说,我得到了一些答案,但仍然不知道为什么我的桌面上的浏览器在调整窗口大小时拒绝应用样式。

1 个答案:

答案 0 :(得分:0)

您可以使用

@media (max-width: px) {}
@media (min-width: px) {}

任何尺寸