CSS中有很多标签在不同浏览器中有不同的兼容性问题,问了让网页的功能更好的不同浏览器中显示正常, 需要通过hack的方式来解决浏览器兼容问题。

CSS hack问题由来已久,目前我的了解甚少,以下是转载别人的介绍。这篇文章详细的介绍了CSS hack,提供了hack解决浏览器兼容的方法。

链接:http://blog.csdn.net/freshlover/article/details/12132801

height、top通过计算的方式进行浏览器兼容。

*height:expression(((document.documentgetElement.clentHeight>0)?document.documentElement.clientHeight:document.clientHeight)+"px");

_top:expression((document.documentElement.srcollTop-this.offsetHeight+this.offsetHeight)+"px"));

Demo:

<div id="pagephoto" style="opacity:0;filter:alpha(opacity=100);position:fixed;_position:absolute; left:0; top:0; right:0; bottom:0; z-index:9999; text-align:center;*height:expression(((document.documentElement.clientHeight>0)?document.documentElement.clientHeight:document.documentElement.clientHeight)+'px');*width:100%;_top:expression((document.documentElement.scrollTop-this.offsetHeight+this.offsetHeight)+'px');">
<div style="position:absolute; left:0; top:0; right:0; bottom:0; background:#000;" onClick="$('#pagephoto').slideUp('slow')"></div>
<div style=" display:inline-block;*display:inline; width:1px; height:100%; margin:0 -0.5em 0 -1px; position:relative; vertical-align:middle;"></div>
<a href="http://www.faw-mazda.com/index.php/detail/cx-4/121#main" target="_blank"><img src="http://www.faw-mazda.com/data/template/mazda/images/index/show_cx4.jpg" style="max-width:100%; max-height:100%; vertical-align:middle; position:relative;"></a>
</div>

链接:http://www.faw-mazda.com/

CSS Hack兼容的更多相关文章

  1. IE6/IE7/IE8/Firefox/Chrome/Safari的CSS hack兼容一览表

    浏览器兼容问题一直是前段开发工程师比较头痛的问题,熟悉了里面的规则也就变得简单了,这里有一份资料可以分享给大家,大家平时开发过程中遵循这个规律的话,会变得轻松多了: 各浏览器CSS hack兼容表: ...

  2. CSS hack兼容表

    IE6 IE7 IE8 Firefox Opera Safari !important Y Y Y Y Y _ Y * Y Y *+ Y \9 Y Y Y \0 Y nth-of-type(1) Y ...

  3. 兼容IE6/IE7/IE8/FireFox的css hack

    兼容IE6/IE7/IE8/FireFox的css hack .color{ background-color: #CC00FF; background-color: #FF00009; *backg ...

  4. css js 兼容问题

    js  兼容问题 1. document.form.item 问题问题:代码中存在 document.formName.item("itemName") 这样的语句,不能在FF下运 ...

  5. 用CSS hack技术解决浏览器兼容性问题

    什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CSS ...

  6. 【荐】说说CSS Hack 和向后兼容

    人一旦习惯了某些东西就很难去改,以及各种各样的原因,新的浏览器越来越多,而老的总淘汰不了.增长总是快于消亡导致了浏览器兼容是成了谈不完的话题.说 到浏览器兼容,CSS HACK自然而然地被我们想起.今 ...

  7. CSS中兼容的一面-----Hack

    国庆了,出去玩耍,也有好长时间没有更新博客了.. 今天就和大家共享一篇技术博文吧.. CSS中兼容的一面-----Hack技术大全 兼容范围: IE:6.0+,FireFox:2.0+,Opera 1 ...

  8. 【原】webapp开发中兼容Android4.0以下版本的css hack

    话说现在的手机型号越来越多,主要还是android和ios这2个巨头称霸了江湖,而他们自带的浏览器内核是webkit,那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了 ...

  9. CSS Hack汇总快查(CSS兼容代码演示)

    文章出处和来源网址:http://www.divcss5.com/css-hack/c284.shtml 以下是常用CSS HACK问题及解决代码-DIV+CSS网支持 1.屏蔽IE浏览器(也就是IE ...

随机推荐

  1. 降维之主成分分析法(PCA)

    一.主成分分析法的思想 我们在研究某些问题时,需要处理带有很多变量的数据,比如研究房价的影响因素,需要考虑的变量有物价水平.土地价格.利率.就业率.城市化率等.变量和数据很多,但是可能存在噪音和冗余, ...

  2. Jenkins项目部署使用教程-----03节点添加

    1)添加节点 系统管理——>管理节点——>新建节点 进入配置界面 点ok进入配置界面配置,——>高级 点击save保存,进入节点,点击Launch agent使得jenkins服务器 ...

  3. Python3之XML模块

    一.简介 xml是实现不同语言或程序之间进行数据交换的协议,可扩展标记语言,标准通用标记语言的子集.是一种用于标记电子文件使其具有结构性的标记语言.xml格式如下,是通过<>节点来区别数据 ...

  4. loj #535. 「LibreOJ Round #6」花火 树状数组求逆序对+主席树二维数点+整体二分

    $ \color{#0066ff}{ 题目描述 }$ 「Hanabi, hanabi--」 一听说祭典上没有烟火,Karen 一脸沮丧. 「有的哦-- 虽然比不上大型烟花就是了.」 还好 Shinob ...

  5. 华为敏捷/DevOps实践:产品经理如何开好迭代计划会议

    大家好,我是华为云DevCloud项目管理服务的产品经理恒少,作为布道师和产品经理,出差各地接触客户是常态,线下和华为云的客户交流.布道.技术沙龙. 但是线下交流,覆盖的用户总还是少数.我希望借助线上 ...

  6. vue is detected

    Vue.js is detected on this page. Devtools inspection is not available because it's in production mod ...

  7. 014 Android BottomNavigationView 底部导航组件使用

    1.导入BottomNavigationView组件(点击下载按钮,安装组件) 2.新建菜单 (1)app--->src-->main--->res ,选中res目录右击new--- ...

  8. CodeForces - 1110C-Meaningless Operation(打表找规律)

    Can the greatest common divisor and bitwise operations have anything in common? It is time to answer ...

  9. codeforces833B The Bakery

    题面传送门 题目大意:将一个长度为n的序列分为k段,使得总价值最大,一段区间的价值表示为区间内不同数字的个数 思路: 显然的dp. 先想到一个朴素的状态转移方程 $dp[i][k]=max(dp[j] ...

  10. hibernate树

    1. 树实现通过pid进行指向上一层来实现,实体类代码如下 package com.test.model; import java.util.HashSet; import java.util.Set ...