max-device-width和max-width的区别
2024-10-19 09:00:37
比如用媒体查询响应输出@media (max-width: 767px),用谷歌浏览器手机测试插件显示并无变化,其实关键在于max-device-width和max-width,以下摘抄↓
max-device-width和max-width是有区别的,表现在如下几个方面:
1、max-device-width是设备整个显示区域的宽度,例如,真实的设备屏幕宽度。
2、max-width是目标显示区域的宽度,例如,浏览器宽度。
3、如果使用max-device-width,那么在PC浏览器上浏览网页时,缩小或放大浏览器时是不执行CSS的,因为“PC设备”没有变化。但如果使用max-width,缩小或放大浏览器时是执行CSS的,因为“显示区域”即浏览器大小发生了变化。
4、如果使用max-device-width,那么当手机由竖变横时,CSS是不执行的,因为“手机宽度”并没有变化。如果使用max-width,那么当手机由竖变横时,CSS是执行的,因为“显示区域”发生了变化。
5、通常,面向“移动设备”用户使用max-device-width;面向“PC设备”用户使用max-width。
通过这样解释,你应该对max-device-width和max-width的区别和使用有所了解了吧。
最新文章
- 利用filter过虑用户请求URI显示对应页面内容
- Introduction of Open CASCADE Foundation Classes
- [LintCode] Coins in a Line 一条线上的硬币
- 关于H5中自定义属性的设置和获取
- java中的clone
- C#.Net操作XML方法二
- 深入理解php内核 编写扩展_III- 资源
- WPF 简单的循环GIF播放
- 内网环境上部署k8s+docker集群:集群ftp的yum源配置
- 如何理解git checkout -- file和git reset HEAD -- file
- [C#]左移和右移
- centos安装Nginx1.9.9
- 你试过不用if撸代码吗?
- sql注入case
- Scala进阶之路-Spark本地模式搭建
- Transaction2
- 在Excel中输入超过10的带圈数字
- Linux eject 命令
- 20155327实验一 Java开发环境的熟悉
- centos7添加虚拟IP