@media screen and (min-width: 45em) {

    body:after{

     content:"宽屏"

   }

}

var content = window.getComputedStyle(document.body, ":after").getPropertyValue("content");


if (content === "窄屏") { 


// …… 


} else if (content === "普屏") {


 // …… 


} else if (content === "宽屏") { 


// …… 


}




												


											
伪类+js实现CSS3 media queries跨界准确判断的更多相关文章
	

    
								
  1. HTML5实践 -- 使用CSS3 Media Queries实现响应式设计
		
    CSS3 Media用法介绍:http://www.w3cplus.com/content/css3-media-queries 转载请注明原创地址:http://www.cnblogs.com/so ...
    
		
    2. 
						
  2. Css3 Media Queries移动页面的样式和图片的适配问题(转)
		
    CSS3 Media Queries 摘自:http://www.w3cplus.com/content/css3-media-queries Media Queries直译过来就是“媒体查询”,在我 ...
    
		
    3. 
						
  3. CSS3 Media Queries 详解
		
    说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...
    
		
    4. 
						
  4. CSS3 Media Queries 简介
		
    原文链接:Introduction to CSS3 Media Queries 原文日期: 2014年2月21日 翻译日期: 2014年2月26日 翻译人员: 铁锚 简介 随着移动设备的日益普及,we ...
    
		
    5. 
						
  5. 【css】CSS3 Media Queries 详解【转】
		
    说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...
    
		
    6. 
						
  6. CSS属性、伪类选择器，CSS3选择器
		
    CSS1时IE6是部分支持,伟大的IE6!CSS2时IE6部分支持,伟大的IE6依旧是部分支持!CCS3盛行CSS4也已经提上日程的现在,IE6完全不支持.IE6你该走了,我们会永远记住你的功绩的!I ...
    
		
    7. 
						
  7. CSS3 Media Queries模板:max-width和min-width
		
    CSS3 Media Queries模板 CSS3 Media Queries一般都是使用“max-width”和“min-width”两个属性来检查各种设备的分辨大小与样式表所设条件是否满足,如果满 ...
    
		
    8. 
						
  8. CSS3 Media Queries 实现响应式设计
		
    在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
    
		
    9. 
						
  9. 【CSS3 入门教程系列】CSS3 Media Queries 实现响应式设计
		
    在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 3.python集合
			
    1.集合1.不同元素组成2.无序排列的可hash值3.集合中元素必须是不可变类型(数字,字符串,元祖) 2.集合创建:(1)定义可变类型集合set:把里面元素一个一个进行for循环往大括号里放 set ...
    
			
    2. 
						
  2. 转"container of()函数简介"链接地址
			
    https://blog.csdn.net/s2603898260/article/details/79371024 提示关键字: 指针0的使用 typeof的使用
    
			
    3. 
						
  3. EBS获取code_combination_id（CCID）时段值自动被置为默认值的问题
			
    EBS中在使用标准的API(FND_FLEX_EXT.GET_COMBINATION_ID 和 FND_FLEX_EXT.GET_CCID还有fnd_flex_keyval.validate_segs ...
    
			
    4. 
						
  4. C++类中一个构造函数调用另一个构造函数
			
    class A { int a; int b; int c; public: A(int aa, int bb) : a(aa), b(bb),c(0) { cout << "a ...
    
			
    5. 
						
  5. 冒号课堂 编程范式与OOP思想
			
    上篇:编程范式与编程语言 第1课 开班导言 第2课 重要范式 第3课 常用范式 第4课 重温范式 第5课 语言小谈 第6课 语言简评 下篇:抽象机制与对象范式 第7课 抽象封装 第8课 抽象接口 第9 ...
    
			
    6. 
						
  6. CANVAS笔记
			
    bglayer.add(bgimage) /*后面的层会覆盖前面的,所以要放在上面的,就要后面才添加!*/ bglayer.add(this.shape1) Layer.destroy() layer ...
    
			
    7. 
						
  7. Java高级特性 第6节 注解初识
			
    一.注解概述 Java注解也就是Annotation,是Java代码里的特殊标记,它为Java程序代码提供了一种形式化的方法,用来表达额外的某些信息,这些信息是代码本身无法表示的. 注解以标签的形式存 ...
    
			
    8. 
						
  8. Python小练习（二）
			
    按照下面的要求实现对列表的操作:       1)产生一个列表,其中有40个元素,每个元素是0到100的一个随机整数       2)如果这个列表中的数据代表着某个班级40人的分数,请计算成绩低于平均 ...
    
			
    9. 
						
  9. 1.1.8 怎样在Word的页眉中插入一级标题
			
    可以通过域来实现,其具体的操作步骤: 1.为章.节标题使用标题样式.例如:章标题使用标题1样式,节标题使用标题2样式.操作方法:选中章(节)标题,然后点击选项卡中“样式”中的). 2.设置文档页眉和页 ...
    
			
    10. 
						
  10. 秒懂,Java 注解 (Annotation)你可以这样学 - CSDN博客
			
    https://blog.csdn.net/briblue/article/details/73824058 文章开头先引入一处图片. 这处图片引自老罗的博客.为了避免不必要的麻烦,首先声明我个人比较 ...
    
			
    11.