解决办法：1、保证media书写格式为“@media screen and (css样式){}”；2、检查样式是否冲突；3、设置meta标签的viewport属性；4、media后跟的括号中的内容不能写结束符“;”，如果有，需要去掉。
本教程操作环境：Windows7系统、css3版，Dell G3电脑。
css3 @media不起作用原因汇总
首先确认是不是css本身的问题，而不是媒体查询没有生效；例如
div{display:flex;}/*那么div所有的display效果都将无法生效*/外联样式引入css使用的src，粗心的错误
立即学习“前端免费学习笔记（深入）”；
/*这是错误的*/ /*这是正确的*/
如果是css问题，只能具体问题具体分析。
请按照下面的几种错误进行排查。
第一种错误：格式书写错误and后面必须有空格例如下面代码；
@media screen and (max-width:500px){ }第二种错误：样式冲突；@media查询代码的样式被后面的css所覆盖
企业网站通用源码1.0
下载
企业网站通用源码是以aspcms作为核心进行开发的asp企业网站源码。企业网站通用源码是一套界面设计非常漂亮的企业网站源码，是2016年下半年的又一力作，适合大部分的企业在制作网站是参考或使用，源码亲测完整可用，没有任何功能限制，程序内核使用的是aspcms，如果有不懂的地方或者有不会用的地方可以搜索aspcms的相关技术问题来解决。网站UI虽然不是特别细腻，但是网站整体格调非常立体，尤其是通观全
注意：建议在书写css的过程中，@media查询带的css写在后面，以免这样避免被前面的css覆盖
第三种错误：css本身出了问题导致css不生效
注意：这是一种很常见的错误，例如块元素浮动导致父级元素没有高度；此时给父元素加背景颜色发现没有生效，实际上是css导致的错误，而没有显示。
例如css选择的优先级也会导致对其中一种生效另外一种不生效，等等css错误导致的问题也非常多，就不一 一列举了。
第四种错误：meta属性viewport属性，这个虽然基本常识，应该也会有人漏掉
第五种错误：括号中的内容不能写结束符“;”，以及其它错误。
相关推荐：css视频教程
