如何根据控制宽度而不是视口宽度编写CSS媒体查询

Question

可以根据控制宽度而不是视图宽度编写CSS MediaQuery。

示例：如果容器最小宽度> 1000px set color = red = red，else set color =使用CSS？或者没有其他方法可以实现此风景？

Answer 1

css并不是此作业的适当工具。这不是脚本语言，有条件的功能很少。那很好！那就是应该的。幸运的是，我们有JavaScript。JS使它变得容易。jsfiddle

<div style="width: 1000px" id="content">
   <h2>some title here</h2>
   <p>some content here</p>
</div>
<script>
var div = document.getElementById('content');
var el = div.style.width;
document.write ("SomeText");
if(el === '1000px')
{
    document.body.style.backgroundColor="red";
}
else
{
     document.body.style.backgroundColor="blue";
}
</script>

请记住，如果用户已关闭JavaScript，这将破坏您的样式。没什么大不了的，但值得记住。