正如标题所说,我正试图以纵向模式定位每台设备。
我目前的媒体查询:
'移动':
@media (max-width: 639px),
@media (orientation: portrait) {}
'桌面'等:
@media only screen and (min-width: 640px) {}
出于某种原因,orientation: portrait
不会影响ipad mini 2.为什么?
答案 0 :(得分:1)
我认为您有语法错误,请尝试更好
@media (max-width: 639px), (orientation: portrait) {}
而不是重复@media
指令
@media (max-width: 639px),
@media (orientation: portrait) {}
在此页面上查看针对ipad mini的更具体的媒体查询: http://stephen.io/mediaqueries/#iPadMini
答案 1 :(得分:0)
您需要使用all
定位所有设备
@media all and (orientation:portrait) {
/* Portrait */
}
@media all and (orientation:landscape) {
/* Landscape */
}
答案 2 :(得分:0)
Ipad Mini的分辨率高于媒体查询中使用的分辨率。
此外,您不需要在每一行重复 @media 。
@media(max-width: 639px),
@media (orientation: portrait) {}
尝试:
@media (max-width: 639px) and (orientation: portrait){
}
对于ipad mini:
IPAD MINI PORTRAIT
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1) {
}
您还可以更具体地定位ipad mini的更高像素密度,该密度高于Ipad:
/* ipad Mini Portrait */
@media only screen and (width:768px) and (resolution: 163dpi) {
}
/* ipad Mini Landscape */
@media only screen and (width:1024px) and (resolution: 163dpi) {
}