css怎么判断苹果手机和安卓手机

在CSS中，经常需要判断设备类型来确定样式。现在，我们看一下如何在CSS中判断苹果手机和安卓手机。

/* 判断苹果手机 */@media only screen and (device-aspect-ratio: 2/3) {
  /* iPhone 4 */}
@media only screen and (device-aspect-ratio: 40/71) {
  /* iPhone 5 */}
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio : 2) {
  /* iPhone 6/7/8 */}
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio : 3) {
  /* iPhone 6/7/8 Plus */}
@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (orientation : portrait) and (-webkit-device-pixel-ratio : 3) {
  /* iPhone X/XS/11 Pro */}
@media only screen and (min-device-width : 414px) and (max-device-width : 896px) and (orientation : portrait) and (-webkit-device-pixel-ratio : 2) {
  /* iPhone XR/XS Max/11/11 Pro Max */}
/* 判断安卓手机 */@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
  /* Android devices */}
    

以上代码是一些常见的媒体查询，用于判断不同型号的苹果手机和安卓手机。通过这些媒体查询，可以为不同设备提供适配的样式，以便页面在不同设备上呈现一致的效果。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！