web兼容指南

开始时的准备

 1 <!DOCTYPE html>
 2 
 3 <html lang="en">
 4 <head>
 5     <meta charset="UTF-8">
 6     <!--这段代码来让IE的文档渲染模式永远都是最新的 -->
 7     <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
 8     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 9     <title>社会责任</title>
10     <link href="library/boots/css/bootstrap.min.css" rel="stylesheet">
13     <link href="Css/structure.css" rel="stylesheet" type="text/css">
14     <script type="text/javascript" src="library/jquery-3.2.1/jquery-3.2.1.js"></script>
15     <!--因为IE8既不支持HTML5也不支持CSS3 @media ,所以我们需要加载两个JS文件,来保证我们的代码实现兼容效果-->
16     <!--[if lt IE 9]>
17     <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.js"></script>
18     <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
19     <script type="text/javascript" src="library/jquery-placeholder-gh-pages/jquery.placeholder.js"></script>
20 
21     <![endif]-->
22 </head>

 

 1 //CSS3中-moz、-ms、-webkit和-o分别代表什么意思  
 2   
 3   
 4 -moz-:代表FireFox浏览器私有属性  
 5   
 6   
 7 -ms-:代表IE浏览器私有属性  
 8   
 9   
10 -webkit-:代表safari、chrome浏览器私有属性  
11   
12 -o-:代表opera浏览器私有属性  

 

同样字号的字体在不同浏览器显示大小不一样。

 

IE11下边框使用ridge样式会使着色出现差异,用solid代替。

 

IE11,FireFox:会出现部分字体偏小现象。

 

IE11,FireFox:text-overflow: ellipsis; 会出现失效。

 

posted @ 2017-12-29 17:44  梁古Lc  阅读(106)  评论(0)    收藏  举报