各种跨浏览器兼容的CSS编码准则和技巧

各种跨浏览器兼容的CSS编码准则和技巧的相关文章

• 
  编写跨浏览器兼容的CSS代码

  标签：平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计

  作为 Web 设计师，你的网站在各种浏览器中有完全一样的表现是很多人的目标，然而这是一个永远无法真正实现的目标，很多人认为，完美的跨浏览器兼容并不必要，这样说虽然没错，但在很多情形，一种近似的兼容还是很容易实现的，本文讲的是各种跨浏览器兼容的 CSS 编码准则和技巧。 理解 CSS 盒子模型 如果你想实现不需要很多奇巧淫技的跨浏览器兼容的 CSS 代码，透彻地理解 CSS 盒子模型是首要事情，CSS ...[ 查看全文 ]

  龙武大

  21
• 
  浏览器CSS兼容方案

  标签：Web开发

  网页设计遇到最大的麻烦之一莫过于网页对不同浏览器的兼容性问题了，因为IE 6.0 / IE 7.0 / firefox 2 / Opera 9等主流浏览器对CSS解析不近相同，导致设计的页面效果不一样，所以用什么方法可以有效解决不同浏览器不同页面效果的问题呢？广泛被使用的方法就是CSS Hack，即使用特别的CSS定义显示网页在不同浏览器的设计风格，针对不同的浏览器去写不同的CSS，最大化兼容浏览器。 一般情况下，我都会兼顾IE 6.0...[ 查看全文 ]

  北京小青年33

  21
• 
  各种浏览器兼容问题

  标签：Web开发

  关于用脚本设置onload事件句柄 在IE、Opera均正常有效，唯独FF既不执行，也不报错，因为在FF，document.body.onload是undefined(未定义)，把一个函数赋值给undefined既不会发生什么事情，也不算出错。 这么写的在IE、Opera和FF都有效： 关于用脚本绑定事件句柄 IE 下用 attachEvent， FF 下用 addEventListener 相关讨论如下： http://search.blueidea.com/?q=addEventListener&bi...[ 查看全文 ]

  看着叫吧smile

  51
• 
  FireFox浏览器和IE浏览器下CSS兼容问题

  标签：Web开发

  1.DOCTYPE 影响 CSS 处理 2.FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行 3.FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中 4.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 height 和 width 5.FF: 支持 !important, IE 则忽略, 可用 !important 为 FF 特别设置样式...[ 查看全文 ]

  羿康装饰

  11
• 
  跨浏览器的CSS固定定位

  标签：Web开发

  本文介绍了跨浏览器的CSS固定定位,请看下面的例子: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" html xmlns="http://www.w3.org/1999/xhtml" head style type="text/css" #fixed{position:fixed;top:5em;right:0;}   /*针对IE7、Opera、Firefox一行搞定*/ /style /*IE6...[ 查看全文 ]

  长垣小范

  31
• 
  DIV+CSS必须考虑的浏览器兼容的技巧

  标签：Web开发

  1,盒解释器的不同解释. #box{ width:600px; //for ie6.0- width:500px; //for ff+ie6.0 } #box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width :500px; //for ie6.0- } 2,在ie中隐藏css,使用子选择器 htmlbody #box{ } 3,只有ie识别 *html #box{ } 4,在ie/win有效而ie/max隐藏,使用反斜杠 5,给ie单独定义样式 6,浮动ie产生的双倍距离 #box{ fl...[ 查看全文 ]

  烟火dance

  31
• 
  DIV CSS布局浏览器兼容的问题

  标签：Web开发

  刚学css div布局，总会遇到很多浏览器兼容的问题，这个问题困扰了一段时间，只到看了精通css才看到几个解决办法。 1.加clear空div .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;}/* End hide from IE-mac *...[ 查看全文 ]

  音乐路上陪你走

  71
• 
  网页设计技巧：跨浏览器的CSS固定定位

  标签：Web开发

  跨浏览器的CSS固定定位{position:fixed} 不知道您是否留意了，浏览本站时，浏览器右下角有一个标着top的黑色直角三角形，可以点击它返回到正在浏览的网页页眉。当滚动网页时，它的位置一直没有任何改变，您感觉它怎么样？这就是通过CSS的定位属性{position:fixed}来实现的，通过它可以让HTML元素脱离文档流固定在浏览器的某个位置。 IE7、Firefox、Opera，都支持CSS的{position:fixed}，所以很容易实现 IE...[ 查看全文 ]

  wangguan1982

  01
• 
  CSS Hack兼容各浏览器是否正常

  标签：Web开发

  CSS Hack是在标准 CSS 没办法兼容各浏览器显示效果时才会用上的补救方法，我们在webjx.com中不泛深入介绍CSS兼容性的文章。在各浏览器厂商解析 CSS 没有达成一致前，我们只能用这样的方法来完成这样的任务。 在webjx.com上你可能能搜索到一大堆的 CSS Hack，但是我今天发布的你可能并不都很了解，因为这些都是只针对单独一个浏览器的 CSS Hack。为了向你...[ 查看全文 ]

  aifeng1991

  11
• 
  跨浏览器的 inline-block 实现[CSS]

  标签：Web开发

  最近在为自己做个新站，想到了些效果，实现时碰到了些小麻烦，比如这个 inline block。所幸大多数问题都解决了，所以写出来分享一下。 我们在制作网页时，有时会希望一个元素既能像 block 一样定义宽度和高度，又可以像普通的 inline 一样不断行。例如下面这张图片中红线标出的地方： 通常我们实现这样的效果会使用这样的代码： a href=”#”img src=”….” alt=”….” //a 这样虽然可以达...[ 查看全文 ]

  哥有老婆57

  21
• 
  兼容主流浏览器的CSS透明代码

  标签：Web开发

  透明往往能产生不错的网页视觉效果，先奉上兼容主流浏览器的CSS透明代码: .transparent_class {  filter:alpha(opacity=50);  -moz-opacity:0.5;  -khtml-opacity: 0.5;  opacity: 0.5; }上面的几个属性分别是: opacity: 0.5; 这是最重要的，因为它是CSS标准.该属性支持Firefox, Safari和 Opera. filter:alpha(opacity=50); 这个是为IE6设的，可取值在0-100，其它三个0到1. -moz-opa...[ 查看全文 ]

  旷材旷材旷

  71
• 
  CSS hack定义技巧浏览器兼容一览表

  标签：Web开发

  这是从互联网上整理来的一张CSS hack列表，显示了各浏览器对css hack的支持程度，对我们制作兼容网页非常有帮助。 [ 查看全文 ]

  超越前人135798

  11
• 
  CSS中跨浏览器的inline-block实现

  标签：Web开发

      我们在制作网页时，有时会希望一个元素既能像 block 一样定义宽度和高度，又可以像普通的 inline 一样不断行。例如下面这张图片中红线标出的地方：     通常我们实现这样的效果会使用这样的代码： a href=”#”img src=”….” alt=”….” //a     这样虽然可以达到目的，但相对来说代码还是不够精炼，也不够灵活。而理想的方式，我们仅通过下面的...[ 查看全文 ]

  小柯pony

  01
• 
  针对各种版本的浏览器隐藏CSS的九大技巧

  标签：Html CSS布局 Div+CSS XHTML

  我们都知道浏览器之间是有差异的，很多人在使用XHTML+CSS方式制作网页的时候都曾为此无比头痛。要在这些差异的影响下工作需要很多的技巧，“隐藏CSS”就是其中很重要的一种技巧（甚至是最重要的）。这种技巧的主要思想是，用某些方式对某些浏览器隐藏某些重载的CSS规则。 这篇文章并不是想教你如何使用这种技巧，它面向的是有一定CSS基础的设计开发者，我假定你曾经使用过某种隐藏CSS规则的方法。这里是想把...[ 查看全文 ]

  wml308

  71
• 
  CSS hack浏览器兼容一览表

  标签：Web开发

  CSS hack是指我们为了兼容各浏览器，而使用的特别的css定义技巧。这是国外摘来的一张CSS hack列表，显示了各浏览器对css hack的支持程度，对我们制作兼容网页非常有帮助。 [ 查看全文 ]

  鲁鹏_1369

  11
• 
  兼容所有浏览器的CSS3圆角

  标签：平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计

  前一段时间，我经常收到一个关于如何在IE浏览器中使用CSS3的 border-radius 属性实现圆角HTML元素的问题。你或许知道CSS3的border-radius 属性被Safari、Firefox和Chrome等浏览器原生支持，但是由于某些原因IE并不支持它。 那么要想在IE中实现圆角，你不得不使用一些技巧，比如使用带有背景图片的CSS类(看一下这篇文章)。 而我知道的在各个浏览器中实现圆角的较简单快速的方案是结合CSS3和JavaScript。Curv...[ 查看全文 ]

  单色器windy

  01
• 
  搜狗浏览器兼容模式怎么设置 搜狗浏览器兼容模式设置方法

  标签：软件教程

  搜狗浏览器是一款很不错的浏览器。我们使用搜狗浏览器的时候如果设置兼容模式，会让我们避免很多麻烦。下面小编就给大家介绍一下怎么设置搜狗浏览器的兼容模式 [ 查看全文 ]

  一夕1999

  281
• 
  跨浏览器实现float:center

  标签：Web开发

  原文： http://www.macji.com/blog/article/to-achieve-cross-browser-css-float-center/to-achieve-cross-browser-css-float-center/ 我们都知道float:left和float:right，但是否想过float:center呢？居中浮动。。。 div id="macji"     ul class="macji-skin"         li列表一/li        ...[ 查看全文 ]

  人心不能谈

  31
• 
  网页页面原结构和CSS写法导致浏览器兼容问题

  标签：Web开发

  找Bug 篇 原始代码，未做修正： 运行代码框 !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"html xmlns="http://www.w3.org/1999/xhtml"head runat="server"meta http-equiv="Content-Type" content="text/html; charset=utf-8" /meta http-equiv="Co...[ 查看全文 ]

  Datura1314go

  31
• 
  使ASP程序跨浏览器

  标签：ASP

  使用XML存储的数据给我们带来了极大的方便，而且，XML是跟平台无关的。利用XSLT可以将XML转换成任意格式的文档，比如HTML。另外还可以使用这种方法来实现跨平台浏览器（IE,火狐，WAP浏览器等）的支持。比如用如下 ASP 代码获取客户端浏览器类型： <% Dim objBrowsCap Set objBrowsCap = Server .CreateObject("MSWC.BrowserType") % 浏览器(Browser):<%=objBrowsCap.browser% 浏览器版本(V...[ 查看全文 ]

  巨蟹迟到的祝福

  11