IE浏览器支持响应式网站设计

目前响应式网站设计比较流行, 下面是摘自百度百科有关响应式设计的定义.

响应式网站设计是一种网络页面设计布局,其理念是:集中创建页面的图片排版大小,可以智能地根据用户行为以及使用的设备环境进行相对应的布局。

但是, 响应式设计并不能原生态支持IE8及一下的浏览器, 而IE浏览器目前的使用率仍然比较高(30%左右), 所以, 兼容老的IDE浏览器还是很有必要.

下面说如何让老的IE浏览器支持响应式网站设计.

 

<head>
<!-- some css style here -->
<!--[if lt IE 9]>
<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> 
<![endif]-->
</head>

官方建议将respond.min.js的引入放在所有的css style引入之后, 所以, 一般就放到<head>标签最后即可.

附--常用判断说明:

 

<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->
<!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
<!--[if IE 8]> 仅IE8可识别 <![endif]-->
<!--[if IE 9]> 仅IE9可识别 <![endif]-->

项目范例说明
![if !IE]The NOT operator. This is placed immediately in front of the featureoperator, or subexpression to reverse the Boolean meaning of the expression.
NOT运算符。这是摆立即在前面的功能操作员,或子表达式扭转布尔表达式的意义。
lt[if lt IE 5.5]The less-than operator. Returns true if the first argument is less than the second argument.
小于运算符。如果第一个参数小于第二个参数,则返回true。
lte[if lte IE 6]The less-than or equal operator. Returns true if the first argument is less than or equal to the second argument.
小于或等于运算。如果第一个参数是小于或等于第二个参数,则返回true。
gt[if gt IE 5]The greater-than operator. Returns true if the first argument is greater than the second argument.
大于运算符。如果第一个参数大于第二个参数,则返回true。
gte[if gte IE 7]The greater-than or equal operator. Returns true if the first argument is greater than or equal to the second argument.
大于或等于运算。如果第一个参数是大于或等于第二个参数,则返回true。
( )[if !(IE 7)]Subexpression operators. Used in conjunction with boolean operators to create more complex expressions.
子表达式运营商。在与布尔运算符用于创建更复杂的表达式。
&[if (gt IE 5)&(lt IE 7)]The AND operator. Returns true if all subexpressions evaluate to true
AND运算符。如果所有的子表达式计算结果为true,返回true
|[if (IE 6)|(IE 7)]The OR operator. Returns true if any of the subexpressions evaluates to true.
OR运算符。返回true,如果子表达式计算结果为true。

  

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/369108.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python循环for不从零开始_Python-多处理-巨大的for循环

下午好&#xff0c;我对Python还是很陌生&#xff0c;我必须解决一个需要尝试数十亿个假设的问题...更具体地说&#xff0c;我需要迭代440个元素的列表&#xff0c;但我需要这样做8次...(是的&#xff0c;我知道OS迭代的次数完全是疯狂的。我的机器相当不错&#xff0c;所以我想…

Bridge Across Islands POJ - 3608 凸多边形间最小距离/旋转卡壳

旋转的部分始终感觉有点别扭。。后来发现是因为叉积顺序为负。。 所以让三角形面积逐渐变大实际上就是让三角形面积变小&#xff08;绝对值意义上的&#xff09;&#xff0c;这样就是让高变小了。。 至于为什么要选最下和最上。。应该是为了满足两条线始终可以生成所有多边形间…

绑定到JSON和XML –处理集合

EclipseLink JAXB&#xff08;MOXy&#xff09;的优势之一是能够通过一组元数据将对象模型映射到JSON和XML。 一个弱点是您需要在JSON键或XML元素上折衷集合属性。 我很高兴地说这个问题已经在EclipseLink 2.5&#xff08;和EclipseLink 2.4.2&#xff09;中得到解决&#xff0…

【WIP】Bootstrap 基础

创建: 2017/09/28 更新: 2017/10/14 标题加上【WIP】转载于:https://www.cnblogs.com/lancgg/p/8281714.html

xml mysql 模糊查询_mybatis+Spring mysql的模糊查询问题

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼查询的mapping.xml语法resultType"java.lang.Integer">SELECTcount(yy_id)FROMmc_usersystem_version like CONCAT(%,${system_version },% )比如当我为字段 system_version 赋值为 ”3512“ 的时候 能查询出来若是我…

css 浮动和清除浮动

在写页面布局的过程中&#xff0c;浮动是大家经常用的属性。在好多的排版布局中都是用的的浮动比如说下面这些地方都是应用到了浮动。 在我学习浮动的时候可是熬坏了脑筋&#xff0c;在这里我分享一下我对浮动这块知识的总结。 一、浮动的定义 使元素脱离文档流&#xff0c;按…

Java Code Geeks和Packt提供的Hadoop书籍赠品

亲爱的极客&#xff0c;由于参与度很高&#xff0c;并且为了有机会赢得尽可能多的Hadoop粉丝&#xff0c;我们决定将竞赛延长一个星期&#xff0c;直到下周二。 各位极客&#xff0c; 赠品在Java Code Geeks上继续。 我们很高兴地宣布&#xff0c;我们再次与Packt Publishin…

【转】 差分约束系统详解(转化为最短路) (概念)

---恢复内容开始--- 转自&#xff1a;http://www.cnblogs.com/void/archive/2011/08/26/2153928.html 差分约束系统中&#xff1a; 如果求未知数的最大值&#xff0c;那么按小于等于建图后求最短路即可。&#xff08;因为求最短路是由无穷向下约束而得到的&#xff0c;所以得到…

jq实现点击某元素之外触发事件

1 $(document).bind("click",function(e){ 2 var target $(e.target); 3 if(target.closest("#parentId").length 0){//点击id为parentId之外的地方触发 4 layer.close(tip_index); 5 type0; 6 } 7 }) …

mysql数据库连接时区设置_springboot 连接数据库之时区设置

抽空查看以前的开发日志&#xff0c;发现了一些“问题”日志&#xff0c;决定整理后陆陆续续发出来吧&#xff0c;也为有需要的话小伙伴提供点帮助。在springboot启动之时&#xff0c;报错了&#xff0c;一看应该就是连接MySql数据库时出的问题。create connection SQLExceptio…

【HTML基础】表格和表单

本次博客的主要内容如下&#xff1a; meta和link表格表单 meta和link meta meta的属性有两种&#xff1a;name和http-equiv。 name属性主要用于描述网页内容&#xff0c;对应与网页内容。 1.关键字&#xff0c;当搜索引擎在爬取内容的时候&#xff0c;会根据关键字判断&a…

定义EJB 3.1视图(本地,远程,无接口)

这篇文章将讨论使用批注定义EJB视图的可能方法&#xff08;最后我将只提到使用EJB部署描述符&#xff09;。我将重点介绍最新的EJB 3.1视图&#xff0c;这些视图将省略旧的本地&#xff0c;远程和本地接口。 因此&#xff0c;我们可以选择&#xff1a; 远程业务界面视图&#…

小鱼的数字游戏

题目描述 小鱼最近被要求参加一个数字游戏&#xff0c;要求它把看到的一串数字&#xff08;长度不一定&#xff0c;以0结束&#xff0c;最多不超过100个&#xff0c;数字不超过2^32-1&#xff09;&#xff0c;记住了然后反着念出来(表示结束的数字0就不要念出来了)。这对小鱼的…

iview给radio按钮组件加点击事件

<RadioGroup v-model"formValidate.phone"><Radio label"phone">商家电话</Radio><Radio label"leaderPhone">负责人电话</Radio><span click"inputPhone()"><Radio label"newPhone"…

python json 不好用_Python之json使用

一、概念json是一种通用的数据类型&#xff0c;任何语言都认识接口返回的数据类型都是json长得像字典&#xff0c;形式也是k-v { }其实json是字符串字符串不能用key、value来取值&#xff0c;要先转成字典才可以格式如下&#xff1a;{"error_code": 0,#要使用双引号&…

jstack命令(Java Stack Trace)

转&#xff1a;http://blog.csdn.net/fenglibing/article/details/6411940 JDK内置工具使用 一、javah命令(C Header and Stub File Generator) 二、jps命令(Java Virtual Machine Process Status Tool) 三、jstack命令(Java Stack Trace) 四、jstat命令(Java Virtual Machine …

EJB继承与Java继承不同

尽管EJB继承有时使用Java继承&#xff0c;但它们并不总是相同的。 就像您在我以前的文章中可以读到的那样 &#xff0c;EJB不必实现任何接口即可公开业务接口。 另一种方法也是正确的-仅仅是因为EJB实现了某个接口或扩展了其他EJB并不意味着它公开了全部或任何视图。 假设我们…

信号量

信号量Semaphore初探 1.信号量(Semaphore)简述 信号量Semaphore是java.util.concurrent包下一个常用的同步工具类,他维护了一个许可集,可以理解成资源数,可以通过aquire操作来获取一个资源, 并通过release来释放一个资源,但需要注意的是,release来释放资源前不一定要先通过acqu…

(2017.9.27) 自定义列表项 list-style 使用心得

今天给某公司做招聘专页。早上完成设计图&#xff0c;下午开始排版。页面套用了我之前做的某人才局的招聘页面&#xff0c;导航栏、banner 很快就出来了。这次内容里我有些地方用了列表&#xff0c;当然要用 <ul> <li> 标签。列表项&#xff08;小圆点&#xff09;…

链式存储mysql_链栈:栈的链式存储结构

前面讲完了栈的顺序存储结构&#xff0c;我们现在来看看栈的链式存储结构&#xff0c;简称为链栈。链栈是没有附加头结点的运算受限的单链表。栈顶指针就是链表的头指针。栈是用栈顶来做插入和删除操作&#xff0c;那么对于链栈的栈顶放在链表的头部还是尾部呢&#xff1f;单链…