媒体查询冲突

我尝试使用，使我的网站响应2个设备媒体查询冲突

三星标签（600×1024）
的iPad（768×1024）

以下媒体查询

@media only screen and (min-device-width : 600px) and (max-device-width : 1024px) and (orientation : portrait){ }

和

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait){ }

但是当我在三星攀开口我的网站，它的应用iPad的媒体查询风格

我能为这个做什么？

来源

2013-05-10 Rohan Patil

使用：https：//github.com/tarunsharma20/initiator – Tarun 2013-05-10 11:06:20

使用媒体查询来定位特定设备是一种可怕的RWD方式（请参阅：http://designshack.net/articles/css/responsive-design-why-您选择 - 做 - 我t-wrong /和http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/） – cimmanon 2013-05-10 11:54:56

您可能希望避免媒体查询重叠。不要用哪种设备来考虑它，而要考虑哪种屏幕尺寸。目标600-767像素之一，而在另一768-1024，就像这样：在纵向

三星标签

@media only screen and (min-device-width : 600px) and (max-device-width : 767px)

三星Tab键在景观和iPad或者

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)

来源

2013-05-10 11:04:48 Maloric

感谢@Maloric为此 – 2013-05-13 04:28:55

感谢它为我工作... – 2017-03-28 10:56:11

媒体查询冲突

回答

相关问题