每个浏览器的媒体查询

Question

我想根据浏览器调整输入字段的大小.我可以为每个浏览器编写媒体查询,以便在单独的浏览器上为输入字段分别设置宽度,例如对于mozilla,它将在chrome和opera上具有单独的宽度,它将具有单独的宽度.

Answer 1

媒体查询是媒体查询,而不是浏览器查询.它们用于测试视口,设备或显示的某些属性.没有媒体功能可以让您测试某个浏览器.

@LukyVj:该网站的名称应该告诉您,它实际上并不是一种针对浏览器的方式,而是一种黑客攻击,恰好以这种方式工作.它与21世纪初的CSS黑客一样,随着浏览器的变化,随着时间的推移停止工作.展示的行为不是规范的结果,而是实现中的怪癖.他们最终将停止工作并且不受支持(例如,如果Mozilla无意中打破了这一点,他们将不会向后弯腰以使其再次起作用). (8认同)
对不起,先生,但你错了.可以使用媒体查询来定位浏览器(请参阅此处:http://browserhacks.com/)例如,此媒体查询特定于FF + 30` @ media all和(min - moz-device-pixel-ratio) :0)和(min-resolution:3e1dpcm){}`另外,使用"@supports"可以定位特定的浏览器,例如:`@supports(-moz-appearance:meterbar)和(background-blend-模式:差异,正常){}`将目标FF> 30 (4认同)

Answer 2

如果您想这样做，您应该能够在 browserhacks.com 上找到一些内容，其中有一堆代码示例来解释如何使用 css 媒体查询获取浏览器，因此对于 IE，您可以这样做。

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {}

这是有效的，因为这些规则将适用的唯一浏览器是 Internet Explorer