有时,你想为Ipad和Ipad pro设计页面,所以你必须使用媒体查询来编写CSS样式。
这篇文章涵盖了Ipad在不同方向上的正确媒体查询。
苹果公司的iPad平板电脑有不同的版本11和最新的版本12.x。
Ipad和pro的最新版本是12.x。
我们用设备的宽度、高度和方向来写媒体查询。
Ipad有两个版本(基本版和专业版),这是一个IPAD媒体查询。
@media all and (device-width: 768px) {
}
这里是ipad pro的媒体查询
@media all and (device-width: 1024px) {
}
上述所有代码只在没有方向的情况下工作。
要使它具有方向性,我们需要指定高度和方向。
Ipad方向的CSS查询
@media only screen and (width: 768px) and (height: 1024px) and (orientation:portrait) { div{ width: 50%; }}
@media only screen and (width: 768px) and (height: 1024px) and (orientation: landscape) { div{ width:50%; }}