css3

1.box-shadow:

filter:progid:DXImageTransform.Microsoft.Shadow(color=#,direction=,strength=);/*兼容ie*/

-moz-box-shadow: 2px 2px 10px #;/*兼容firefox*/

-webkit-box-shadow: 2px 2px 10px #;/*兼容safari或chrome*/

box-shadow:2px 2px 10px #;/*兼容opera或ie9*/

2.background-size  //兼容IE8,需要引用backgroundsize.min.htc

 background:url(images/.jpg) center no-repeat;

  background-size:cover;

 -ms-behavior:url(backgroundsize.min.htc);//相对路径

 behavior:url(backgroundsize.min.htc);//相对路径

3.css透明问题

IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=,opacity=)。
FF:opacity:0.6

4.浏览器bug

4.1 IE的双边距bug

  设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。

  解决方案:在这个div里面加上display:inline;

4.2 高度不适应

  高度不适应是当内层的对象高度发生变化时,外层高度不能自动进行调节,特别当内层对象使用margin或者padding时。

  例如:

.box p{
   margin-top:20px;
   margin-bottom:20px;
   text-align:center;
}  <div class="box">
   <p>p对象中的内容</p>
 </div>

  解决方法:在P对象上下各加2个空的div对象,css代码: {height:0;overflow:hidden},或者为div加上border属性。  

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <style>
    /*.box{
      border:1px solid red;
    }*/
    .box div{
      height:0px;
      overflow:hidden;
    }
    .box p{
      margin-top:20px;
      margin-bottom:20px;
      text-align:center;
    }
    </style>
  </head>
  <body>
     <div class="box">
       <div></div>
         <p>p对象中的内容</p>
       <div></div>
     </div>
  </body>
</html>

css兼容写法的更多相关文章

  1. 浏览器 CSS 兼容写法的测试总结

    做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...

  2. DIV水平垂直居中的CSS兼容写法

    DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...

  3. IE浏览器兼容问题(上)——html和css的兼容写法

    用户使用的浏览器五花八门,我们要保证每一种浏览器都能兼容我们的代码,不能要求用户去改变浏览器,那么就得在我们的代码上下功夫.此时我们要用到hack. HACK就是针对不同的浏览器写不同的HTML.CS ...

  4. css 背景色渐变兼容写法

    最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...

  5. 【css】css 背景色渐变兼容写法

    最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...

  6. (转)css 背景色渐变兼容写法

    css3:linear-gradient 比如:黑色渐变到白色,代码如下: .gradient{ background: -moz-linear-gradient(top, #000000 0%, # ...

  7. IE和firefox火狐在JS、css兼容区别

    1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...

  8. javascript阻止事件冒泡的兼容写法及其相关示例

    //阻止事件冒泡的兼容写法 function stopBubble(e){ //如果提供了事件对象,则是一个非IE浏览器 if(e && e.stopPropagation) //因此 ...

  9. css兼容问题集合

    css兼容问题 兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白 ...

随机推荐

  1. 第四天:servlet的生命周期和一些细节问题

    1.  servlet的生命周期: a)  流程 i.  Web服务器首先会检查是否装载了该servlet的实例对象.如果装载了直接进行第四步. ii.  装载并创建该servlet的实例对象. ii ...

  2. Springboot中AOP统一处理请求日志

    完善上面的代码: 现在把输出信息由先前的system.out.println()方式改为由日志输出(日志输出的信息更全面) 现在在日志中输出http请求的内容 在日志中获取方法返回的内容

  3. MyBatis总结六:resultMap详解(包含多表查询)

    简介: MyBatis的每一个查询映射的返回类型都是ResultMap,只是当我们提供的返回类型属性是resultType的时候,MyBatis对自动的给我们把对应的值赋给resultType所指定对 ...

  4. div+css学习笔记一(转)

    div+css学习笔记一 (2011-05-12 07:32:08) 标签: div css 居中 背景图片 ie6 ie7 margin 杂谈 分类: 网页制作 1.IE6中用了float之后导致m ...

  5. 推荐两款富文本编辑器:NicEdit和Kindeditor

    做过Web开发的朋友相信都使用过富文本编辑器,比较出名的CuteEditor和CKEditor很多人应该已经使用过,在功能强大的同时需要加载的东西也变得很多.下面要推荐的两款富文本编辑器都是使用JS编 ...

  6. Linux expect命令

    一.简介 通过Shell可以实现简单的控制流功能,但是对于需要交互的场合则必须通过人工来干预,有时候我们可能会需要实现和交互程序如telnet服务器等进行交互的功能.而就使用来实现这种功能的工具.Ex ...

  7. post请求时,出现relationship name error

    原因:在post请求,其属性名在代码中已经修改为partyLocationDtos,但是在swagger中,仍然为partyLocations. 因此,报错.记住,在post请求的时候,要一一对应.写 ...

  8. Java中抽象类也能实例化.RP

    在Java中抽象类真的不能实例化么? 在学习的过程中,发现了一个问题,抽象类在没有实现所有的抽象方法前是不可以通过new来构建该对象的,但是抽象方法却是可以有自己的构造方法的.这样就把我搞糊涂了,既然 ...

  9. String、StringBuffer与StringBuilder之间区别 .RP

    最近学习到StringBuffer,心中有好些疑问,搜索了一些关于String,StringBuffer,StringBuilder的东西,现在整理一下. 关于这三个类在字符串处理中的位置不言而喻,那 ...

  10. 数据结构_yjjsj(伊姐姐数字游戏)

    问题描述 伊姐姐热衷于各类数字游戏, 24 点. 2048.数独等轻轻松松毫无压力.一日,可爱的小姐姐邀请伊姐姐一起玩一种简单的数字 game,游戏规则如下:一开始桌上放着 n 张数字卡片,从左到右按 ...