css兼容写法
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兼容写法的更多相关文章
- 浏览器 CSS 兼容写法的测试总结
做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...
- DIV水平垂直居中的CSS兼容写法
DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...
- IE浏览器兼容问题(上)——html和css的兼容写法
用户使用的浏览器五花八门,我们要保证每一种浏览器都能兼容我们的代码,不能要求用户去改变浏览器,那么就得在我们的代码上下功夫.此时我们要用到hack. HACK就是针对不同的浏览器写不同的HTML.CS ...
- css 背景色渐变兼容写法
最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...
- 【css】css 背景色渐变兼容写法
最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...
- (转)css 背景色渐变兼容写法
css3:linear-gradient 比如:黑色渐变到白色,代码如下: .gradient{ background: -moz-linear-gradient(top, #000000 0%, # ...
- IE和firefox火狐在JS、css兼容区别
1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...
- javascript阻止事件冒泡的兼容写法及其相关示例
//阻止事件冒泡的兼容写法 function stopBubble(e){ //如果提供了事件对象,则是一个非IE浏览器 if(e && e.stopPropagation) //因此 ...
- css兼容问题集合
css兼容问题 兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白 ...
随机推荐
- python爬虫(7)--Beautiful Soup的用法
1.Beautiful Soup简介 简单来说,Beautiful Soup是python的一个库,最主要的功能是从网页抓取数据. Beautiful Soup提供一些简单的.python式的函数用来 ...
- eclipse 中使用 GreenUML 和 AmasterasUML 自动生成类图
Green UML和AmaterasUML 两种 一.安装方法: 1.都是先安装GEF 通过eclipse-> install new software安装GEF的网址: http://down ...
- 【安装关键】webStorm-201703版本
在激活页面选择License Server,输入:http://idea.codebeta.cn,点击Activate即可激活.
- 线段树教做人系列(2)HDU 4867 XOR
题意:给你一个数组a,长度为.有两种操作.一种是改变数组的某个元素的值,一种是满足某种条件的数组b有多少种.条件是:b[i] <= a[i],并且b[1]^b[2]...^b[n] = k的数组 ...
- auth 权限控制
一. 权限介绍所谓权限控制,大部分是在管理后台上使用.比如超级管理员登录,会得到所有操作的控制权:认证专员,只能给会员做认证操作:审核专员,只能操作内容的审核.删除.加精等操作,以此类推.那么 Thi ...
- 使用IDEA开发SPARK提交remote cluster执行
开发环境 操作系统:windows 开发工具:IntelliJ IDEA 14.1.1 需要安装scala插件 编译环境:jdk 1.7 scala 2.10.4 使用IDEA开发spark应用 ...
- EMR问题
-- 门急诊患者生命体征信息 select t.clinic_code, t.*,t.rowid from ptm_opr_maininfo t where t.patient_id='0000E05 ...
- enumerate()函数
for index,value in enumerate(list): print index,value 等于for i in range(0,len(list)): print i,l ...
- 处理器适配器(handlerAdapter)执行源码分析(涉及到适配器模式)(九)
适配器:实现很多接口统一管理. DispatcherServlet 组建的默认配置 HttpRequestHandlerAdapter,SimpleControllerHandlerAdapter,A ...
- Java50道经典习题-程序37 报数
题目:有n个人围成一圈,顺序排号.从第一个人开始报数(从1到3报数),凡报到3的人退出圈子,问最后留下的是原来第几号的那位.分析:最后留下的是第n号那位 import java.util.Scanne ...