想知道是否有方法让元素认为视口是特定宽度?
这将用于测试响应式CSS实用程序。例如,此CSS组件是响应式的,但要查看其行为,用户必须缩小浏览器窗口。
如果有一种“欺骗”标记测试元素以认为视口是特定宽度的方法,则不需要手动拖动浏览器窗口。
一个可能性,尽管我怀疑它已被实现,就是浏览器开发工具公开API,允许我们选择并通知浏览器某些元素应认为浏览器在特定视口大小下呈现...
一个方法
当对此测试进行试验时,我无意中发现了一种在没有开发者工具的情况下触发媒体查询的方法,即使用ctrl +放大视口。 这将触发媒体查询,尽管显然不具有我正在寻找的声明性精度。
u-sm-padding-2rem
可以设置填充,但仅当视口较小时才能生效,这样测试就可以显示出来,而无需开发人员模拟开发者工具内部的小视口。 - Ole--sm, --md, --large
。但是触发媒体查询的视口大小必须改变。理想情况下,我们可以将组件放在一个“认为”视口处于某个特定大小的元素内,这样它就会呈现出当视口实际具有该大小时呈现组件的方式。 - Ole