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. 在JAVA中,String,Stringbuffer,StringBuilder 的区别

    首先是,String,StringBuffer的区别 两者的主要却别有两方面,第一是线程安全方面,第二是效率方面 线程安全方面: String  不是线程安全的,这意味着在不同线程共享一个String ...

  2. 数据库之_CRUD

    CRUD是指在做计算处理时的增加(Create).读取查询(Retrieve).更新(Update)和删除(Delete)几个单词的首字母简写.主要被用在描述软件系统中DataBase或者持久层的基本 ...

  3. 吸收效果,像是在Mac上的垃圾桶的效果一样

    #import "AppDelegate.h" #import <QuartzCore/QuartzCore.h> @interface AppDelegate () ...

  4. redhat图形界面启动后出现桌面但是没有登录界面解决办法

    redhat图形界面启动后出现桌面但是没有登录界面解决办法 2014年07月11日 10:50:10 阅读数:7931 redhat Linux一直用着好好地,今天打开只有图像界面背景,没有出现登陆界 ...

  5. 树莓派研究笔记(3)-- 安装VNC

    小屏幕太小了,眼睛快看瞎了,必须安装VNC 才行啊. 更新—2018-02-04 最新版本的系统中自带了VNC了,只需要在 菜单 Preferences -> Raspberry Pi Conf ...

  6. Entity Framework Code-First(21):Automated Migration

    Automated Migration: Entity framework 4.3 has introduced Automated Migration so that you don't have ...

  7. map集合的应用

    分析以下需求,并用代码实现: (1)利用键盘录入,输入一个字符串 (2)统计该字符串中各个字符的数量例如 用户输入字符串"If~you-want~to~change-your_fate_I_ ...

  8. labview中的移位寄存器、循环隧道,自动索引隧道的区别

    对于循环结构(For 循环.while循环)而言,循环体内的数据域外部数据的传递是通过以下三种方式: 1.移位寄存器2.循环隧道3.自动索引隧道 第一.各自的区别.作用 循环隧道,就是把数据传入传出循 ...

  9. python基本概念——标识符

    标识符是用来标识某样东西的名字.在命名标识符的时候,你要遵循这些规则: 标识符的第一个字符必须是字母表中的字母(大写或小写)或者一个下划线(‘ _ ’). 标识符名称的其他部分可以由字母(大写或小写) ...

  10. [学习笔记]通过open函数改变标准输出的方法

    int main(void) { char s[] = "abc.txt"; ; close(STDOUT_FILENO);//关闭标准输出文件描述符 int fd1 = open ...