javascript - CSS媒体查询以获取确切的视口(viewport)宽度

使用javascript，我创建了一个元视口(viewport)，并为其分配了980px的值。脚本是这样的:

var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=980, user-scalable=1";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);

在CSS中，是否可以编写仅在视口(viewport)宽度完全为980px时才触发的媒体查询？

最佳答案

你可以做这样的事情。媒体查询将以980px的宽度触发，并且宽度不超过980px时有效。

 @media screen and (min-width: 980px) and (max-width: 980px) {
     html {background-color: red !important;}
 }

 html {background-color: green; min-height: 300px;}