前端ie7的兼容问题及解决方案(未完待续)
最近在维护一些老的项目,需要兼容ie7 ,css3就不能用了,这里总结一下碰到的问题及解决方案。
1、盒模型
ie7、8 的盒模型都是 box-sizing为content-box的盒模型,这里在做的时候就要注意
2、display:inline-block
碰到使用块级元素的场景 有兼容写法 *display:inline;*zoom:1。
不愿这么写的话就用float吧,不过要记得请浮动
3、水平垂直居中
在c3中我们可以用 flex ,可以用transform,实现水平垂直居中。在ie7下 怎么办呢?
如果是已知宽高的元素,我们可用 定位:left:50%,margin-left:-100px;这种方法居中
未知宽高的话,先转成 inline ,用text-align:center;和line-height 去实现水平和居中定位。
4、透明度
ie7不支持opacity 和 rgba() 这种方式设置透明度,碰到一些场景,比如模态框 的透明背景,如何兼容呢?
这里在写代码的时候 除了用 opacity:0.2 再加 filter:alpha(opacity:20);就可以了 (亲测有效)
5、圆角和阴影
border-radius 和box-shadow 是不支持的,只能用背景图片代替了.......
6、dataset
ie7下不支持 event.target.data('')这种方法获取dataset
我们可以用 event.target.getAttribute('data-index') 获取data属性值
7、border-spacing
这个貌似是表格边框的属性,ie8支持,可以设置表格的间距。
ie7下 加兼容写法 *border-spacing:expression(this.cellSpacing="14px")
cell-spacing 都可以用这种写法 详见这篇博客https://blog.csdn.net/gdfjhc/article/details/87298303
目前就接触这么多,后面的有空再补充吧。
前端ie7的兼容问题及解决方案(未完待续)的更多相关文章
- 前端工程师IE6兼容性问题随笔(未完待续)
1 height.在IE6下元素高度小于19px的时候,会被当做19px来处理.解决办法:用overflow:hidden;来处理.box{height:2px;background:red;over ...
- javascript有用小功能总结(未完待续)
1)javascript让页面标题滚动效果 代码如下: <title>您好,欢迎访问我的博客</title> <script type="text/javasc ...
- MVC丶 (未完待续······)
希望你看了此小随 可以实现自己的MVC框架 也祝所有的程序员身体健康一切安好 ...
- Go web编程学习笔记——未完待续
1. 1).GOPATH设置 先设置自己的GOPATH,可以在本机中运行$PATH进行查看: userdeMacBook-Pro:~ user$ $GOPATH -bash: /Users/user/ ...
- 初进MFC的世界,太奇妙。第六次作业----未完待续
又一次的迁徙.我希望能够早些抵达. 第六次作业-未完待续!图形界面,计算器文件 本次的作业是给自己的计算器加一个可视化的窗口,我开始也是很激动和憧憬的,看了很多的界面库,发现并没有想象的那么简单,因为 ...
- Avro和Thrift区别(未完待续)
两者都是优秀的序列化框架: Avro创造之初是Hadoop之父Doug为了创造一种更加快捷的序列化方案(此时已经有了thrift),用于Hadoop的HDFS的文件序列化问题. Thrift一个成熟的 ...
- ASP.NET MVC 系列随笔汇总[未完待续……]
ASP.NET MVC 系列随笔汇总[未完待续……] 为了方便大家浏览所以整理一下,有的系列篇幅中不是很全面以后会慢慢的补全的. 学前篇之: ASP.NET MVC学前篇之扩展方法.链式编程 ASP. ...
- 关于DOM的一些总结(未完待续......)
DOM 实例1:购物车实例(数量,小计和总计的变化) 这里主要是如何获取页面元素的节点: document.getElementById("...") cocument.query ...
- 我的SQL总结---未完待续
我的SQL总结---未完待续 版权声明:本文为博主原创文章,未经博主允许不得转载. 总结: 主要的SQL 语句: 数据操作(select, insert, delete, update) 访问控制(g ...
随机推荐
- 隐藏响应中的server和X-Powered-By
来源:https://www.yduba.com/biancheng-7831560074.html 有时候,我们用调试工具查看别人的网站时,经常看到 X-Powered-By:PHP/7.1.8 这 ...
- union 的概念及在嵌入式编程中的应用
union 概念 union 在中文的叫法中又被称为共用体,联合或者联合体,它定义的方式与 struct 是相同的,但是意义却与 struct 完全不同,下面是 union 的定义格式: union ...
- Spring5参考指南: SpEL
文章目录 Bean定义中的使用 求值 支持的功能 函数 Bean引用 If-Then-Else Elvis Safe Navigation 运算符 集合选择 集合投影 表达式模板化 SpEL的全称叫做 ...
- Spring Boot Starters介绍
文章目录 Web Start Test Starter Data JPA Starter Mail Starter 结论 对于任何一个复杂项目来说,依赖关系都是一个非常需要注意和消息的方面,虽然重要, ...
- 解决material UI中弹窗(dialog、popover等)内容被遮挡问题
在material ui中有几种弹出层,比如:dialog.popover等,这些弹出层都会遇到的一个公共问题是: 假如弹出层中的内容变化了,弹出层的位置并不会重新定位. 这样,假如一开始弹出层定位在 ...
- jQuery学习(二)
操作DOM对象: 修改文本: jQuery对象的text()和html()方法可以用来获取节点的文本内容和HTML文本.而当你给方法传入参数时,这两个方法可以被用于设置jQuery的文本内容. 还是以 ...
- 求x>0时,y=x^3-6x^2+15的极值
解: 当x→∞时,y也→∞,所以y没有最大值. y=x3-6x2+15=-4*(x/2)*(x/2)*(6-x)+15 而根据几何平均数小于等于算术平均数的定理,(x/2)*(x/2)*(6-x)在x ...
- 3DMAX导出到Unity坐标轴转换问题
这是我在3dmax中创建的1cm*1cm*1cm的立方体,右图为3dmax中的坐标系 当我们把这个立方体导入到unity中发现x轴意外的扭转了90度 为了解决这个问题,你需要对模型做出修正 1.选 ...
- 实战-MySQL定时增量备份(2)
概要 引言 增量备份 恢复增量备份 定时备份 引言 在产品上线之后,我们的数据是相当重要的,容不得半点闪失,应该做好万全的准备,搞不好哪一天被黑客入侵或者恶意删除,那就 gg 了.所以要对我们的线上数 ...
- String(字符串) 比较大小 如果有A+B>B+A 则A>B
题目引入: 给定N个整数,那任意顺序排列连成一个数,得到的最大的数是多少? 分析:贪心,字典序排序,都不对大小比较也不对,今天我跟别人想了很久绞尽脑汁,各种模拟都失败了.最后才发现对于俩个数a=313 ...