使用各種平板電腦設備（如iPad、Galaxy Tab、Acer Iconia 和LG 3D Pad）時，以下任務使用CSS 媒體查詢定位特定設備可能具有挑戰性，特別是當它們具有相似的屬性時。以iPad和LG Pad為例；兩者的裝置寬度均為 768px，因此很難區分它們。
要解決此問題並僅使用CSS3 媒體查詢定位iPad，請考慮以下解決方案：
<link rel="stylesheet" media="all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait)" href="ipad-portrait.css" /> <link rel="stylesheet" media="all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape)" href="ipad-landscape.css" />
此方法透過定義特定的設備寬度、高度和方向標準來精確定位iPad。
或者，為了最大限度地減少HTTP 請求，您可以將媒體查詢嵌入到現有的CSS 文件中：
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
.ipad-portrait { color: red; } /* CSS rules for iPad portrait */
}
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
.ipad-landscape { color: blue; } /* CSS rules for iPad landscape */
}請參閱以下資源以獲取更多資訊：
以上是如何使用 CSS 媒體查詢專門針對 iPad？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
