不多说,先来看两个常用的简单效果 …………

兼容拼比一(普通边线效果)

图一:谷歌、火狐、ie8+下

图二:ie6/7下

从图中看出,ie6/7其实是不认识tr边框线的,,所以平时做项目时候,我们一般会给td来设置边框线。要想实现图一只的效果,我们可以给table设置上、右两条边线,然后给td设置左、下两条边线,这是一个很实用的方法。

兼容拼比二(表格里面的隐藏弹框)

图一:谷歌、ie下

图二:火狐下

正常情况下,鼠标经过最后一个td时,都会弹出参加、不参加,未确认这个框。给td设置相对定位,框框绝对定位。在谷歌、ie下显示正常,但是在火狐下,不管经过哪个td,框框都会显示在最上面,并且定位是相对于table来的,蛮奇怪的一个问题,连ie都低头了,怎么平时温顺的火狐反而还不支持了呢?

解决方案一:

给要设置相对定位的td里面加一个div,这时我们给这个div设置相对定位,框框绝对定位就可以了。

解决方案二:

给td设置相对定位,但是在火狐下,需要再加个display:block!important;属性,这时,显示正常。

原因是,火狐中设置position:relative;要与display:block/inline-block才能生效。而在Ie中,position:relative;除了与:display:block/inline-block可以生效外,遇display:table/table-cell;也生效。

关于table的一些兼容性问题的更多相关文章

  1. Delete,Update与LEFT Join

    UPDATE:UPDATE A SET ApproverID=NULL FROM [SH_MaterialApplyBuyBill] A LEFT JOIN [SH_MaterialApplyBuyB ...

  2. Web前端总结(小伙伴的)

    以下总结是我工作室的小伙伴的心得,可以参考一下 html+css知识点总结 HTMl+CSS知识点收集 1.letter-spacing和word-spacing的区别 letter-spacing: ...

  3. css 常用布局

    「前端那些事儿」③ CSS 布局方案 我们在日常开发中经常遇到布局问题,下面罗列几种常用的css布局方案 话不多说,上代码! 居中布局 以下居中布局均以不定宽为前提,定宽情况包含其中 1.水平居中 a ...

  4. 布局:高度已知,布局一个三栏布局,左栏和右栏宽度为200px,中间自适应

    需求:高度已知为200px,写出三栏布局,左栏和右栏各位200px,中间自适应,如下图所示: 方法一:float浮动布局 原理是:定义三个区块,需要注意的是中间的区块放在右边区块的下面,统一设置高度为 ...

  5. JS组件系列——Bootstrap Table 冻结列功能IE浏览器兼容性问题解决方案

    前言:最近项目里面需要用到表格的冻结列功能,所谓“冻结列”,就是某些情况下表格的列比较多,需要固定前面的几列,后面的列滚动.遗憾的是,bootstrap table里自带的fixed column功能 ...

  6. [IE兼容性] Table 之边框 (IE6 IE7 IE8(Q) 中 cellspacing 属性在重合的边框模型的表格中仍然有效)

    在 IE6 IE7 IE8(Q) 中,在通过 border-collapse:collapse 使用表格的重合边框模型后,其 cellspacing 属性仍然有效: 在 其他浏览器 中,此时的 cel ...

  7. IE7,6与Fireofx的CSS兼容性处理方法集结

    CSS对浏览器的兼容性有时让人很头疼,尤其是对于IE6这个问题多多的浏览器版本,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码 ...

  8. CSS中一些常见的兼容性问题

    CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...

  9. javascript中一些常见的兼容性问题

    下面是一些Javascript的IE和Firefox(火狐)兼容性的常用例子 1. document.formName.item("itemName") 问题 说明:IE下,可以使 ...

随机推荐

  1. WordPress 后台提示输入FTP信息

    Wordpress 安裝主題時,需要輸入ftp訊息 參考了:WordPress后台更新提示输入FTP信息 ,解決方法是: 方法一.通過ssh 對wordpress 項目的文件夾賦權限 sudo cho ...

  2. bootstrap兼容IE

    这种响应式的布局正是通过CSS3的媒体查询(Media Query)功能实现的,根据不同的分辨率来匹配不同的样式.IE8浏览器并不支持这一优秀的Css3特性,Bootstrap在开发文档中写了如何使用 ...

  3. .Net 动态代理,AOP

    .Net 动态代理,AOP 直接上代码了. /***************************************** * author:jinshuai * * E-mail:redfox ...

  4. HTTP层 —— 请求

    1.访问请求实例 要通过依赖注入获取当前 HTTP 请求实例,需要在控制器的构造函数或方法中对 Illuminate\Http\Request 类进行类型提示,这样当前请求实例会被服务容器自动注入: ...

  5. MySQL高可用解决方案(MySQL HA Solution)

    http://blog.sina.com.cn/s/blog_7e89c3f501012vtr.html 什么是高可用性?很多公司的服务都是24小时*365天不间断的.比如Call Center.这就 ...

  6. h2database源码浅析:SQL语句的执行

    最近想好好了解一下数据库的原理,下载了h2database的源码,准备好好看看.此过程的一些想法,暂且记下来,权当做读码笔记吧! 为了调试准备的测试用例: @Test public void test ...

  7. ASP.NET会员注册登录模块(MD5加密,Parameters防止SQL注入,判断是否注册)

    MD5加密,Parameters防止SQL注入: protected void btnLog_Click(object sender, EventArgs e)     {         //获取验 ...

  8. Jquery方法大全

    一.JQuery常用的方法 :(JQuery中90%都是方法,没有参数是获取,带参数是设置) $("#id").css('backgroundColor','blue'); .cs ...

  9. SQL SERVER 主键约束

    主键约束: 遵循关系型模型中的第二范式.唯一的识别一条记录,不能为空. CREATE TABLE Persons ( Id_P int NOT NULL PRIMARY KEY, LastName v ...

  10. 学习笔记4_ServletContext(重要整个Web应用的动态资源之间共享数据)

    ServletContext(重要) 一个项目只有一个ServletContext对象! 我们可以在N多个Servlet中来获取这个唯一的对象,使用它可以给多个Servlet传递数据! 与天地同寿!! ...