媒体查询可以获取的值包括（是否可以利用css获取容器内宽度、高度较小的那个值）
本文目录
是否可以利用css获取容器内宽度、高度较小的那个值
使用vw,vh,说明是移动端，移动端的vw必定小于vh,所以直接按照div2 width="200px"即可
请采纳
css媒体查询阈值 什么意思
“响应式设计（Responsive Design）”是一种让网站针对不同的浏览器和设备“响应”不同显示效果的策略，这样可以让网站在任何情况下显示的很棒！
媒体查询是做此事所需的最强大的工具。让我们使用百分比宽度来布局，然后在浏览器变窄到无法容纳侧边栏中的菜单时，把布局显示成一列：
“阈值”命令将灰度或彩色图像转换为高对比度的黑白图像。您可以指定某个色阶作为阈值。所有比阈值亮的像素转换为白色；而所有比阈值暗的像素转换为黑色。“阈值”命令对确定图像的最亮和最暗区域很有用。
用javascript 怎样才能很好的获取手机的屏幕宽度和高度
一般来说在移动浏览器上是拿不到屏幕真实分辨率的，因为页面渲染是在一个叫viewport的页面绘制区域内（说的通俗点就是手机浏览器是用一个虚拟的屏幕来显示网页的）。viewport和屏幕的真实尺寸并不是对应的，如在Safari Mobile中viewport默认宽度（320px）是屏幕真实尺寸（640px）的一半，这里不管是用window.innerHeight还是window.screen.width拿到的都是320px。当然我们可以通过meta设置改变viewport的比例，如initial-scale=.5就可以让viewport和屏幕一致的尺寸，但这个比例在不同的手机上并不一定是2倍关系，特别是Android手机，在大屏手机（5寸以上）上这个值是3倍甚至4倍。而且改变viewport比例后可能会导致后续制作中出现一系列问题。所以我认为不要纠结一定要拿到屏幕真实尺寸，就把viewport的尺寸当成屏幕的尺寸进行页面设计和制作肯定是没有问题的。
有一个非常曲线的解决办法，就是：css的媒体查询（@media）是能够检测屏幕尺寸（其实是浏览器窗体的真实尺寸，并不是屏幕的真实物理尺寸，介意的朋友就不要看了）的，通过它来给网页内的某个元素设置一个特殊的属性，然后再用JavaScript来获取这个属性值。当然这样只能获得一个阶梯值（比如480px到540px之间、540px到600px之间等等），不是精确值，所以可能得不偿失，因此我是不推荐的。
更多文章：
2026年10月11日 05:30
跷二郎腿太低好吗？想要通过贴墙站改正二郎腿影响的话，有哪些要点需要注意
2026年10月11日 05:10
易语言点击js按钮（易语言网页填表怎样点击链接为“javascript:void（0）“的按钮）
2026年10月11日 03:00
2026年10月11日 01:10
2026年10月11日 01:00
compare with造句（用compared with和compared to造句）
2026年10月10日 23:30
2026年10月10日 22:50
tensorflow与keras对应版本（为什么tensorflow2.8没有keras）
2026年10月10日 22:10
2026年10月10日 22:00
maven仓库jar网站（如何在maven仓库中添加jar包）
2026年10月10日 19:50
