针对IE9的CSS兼容

(自己亲自试过有用)针对IE9的CSS只需在相应CSS代码加入只有IE9识别的 \9\0.具体代码如下: .div{ background-color:#0f0\9\0;/* ie9 */ } 其他浏览器写法: /*all*/ background-color:#0ff\0;/* ie 8/9 */ background-color:#0f0\9\0;/* ie9 */ *background-color:#00f;/*ie7*/ _background-color:#ff0;/*ie6*/ b…

怎么写针对IE9的CSS

(自己亲自试过有用)针对IE9的CSS只需在相应CSS代码加入只有IE9识别的 \9\0.具体代码如下: .div{ background-color:#0f0\9\0;/* ie9 */ } 其他浏览器写法: background-color:#f00;/*all*/ background-color:#0ff\0;/* ie 8/9 */ background-color:#0f0\9\0;/* ie9 */ *background-color:#00f;/*ie7*/ _backgroun…

CSS兼容IE6 IE7 IE8 IE9 Firefox的总结

<!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> <title>无标题页</title> &l…

ie6 7 8 9 firefox的css兼容问题

浏览器 CSS 兼容写法的测试总结

做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Firefox 差别不大了,但是IE6,IE7,IE8还是要做单独兼容的,这里总结下兼容方法: 对于 IE6.IE7.IE8 进行 CSS 兼容方法可以看看这篇文章 http://blog.csdn.net/zhouzme/article/details/18901657 以下方法均在 IE6.IE7.I…

js和css兼容问题

(一)html部分 1.H5新标签在IE9以下的浏览器识别  html5shiv.js下载地址 https://github.com/aFarkas/html5shiv/releases2.ul标签内外边距问题ul标签在IE6\IE…

CSS 兼容解决之hack

什么是CSS hack 由于不同的浏览器,甚至同一浏览器的不同版本对CSS的解析认识不一样,导致生成的页面效果不一致,写出针对不同浏览器CSS code就称为CSS hack. 常用的CSS hack 有三种方式,CSS 内部hack.选择器hack.HTML 头部引用,其中第一种最常用. CSS 内部hack 正经的CSS是这么写的 <!DOCTYPE html> <html> <head> <title>Test</title> <st…

CSS兼容各浏览器的hack

CSS兼容各浏览器的hack:建议:尽可能的手写代码,可以有效的提高学习效率和深度.浏览器的种类多,麻烦自然也多,主要是各种浏览器对某些属性的渲染效果并不相同,所以有时候需要专门针对特定浏览器或者特定版本书写CSS代码,这样就需要用到所谓的“CSS Hack”,下面以一段实例的形式介绍一下个浏览器hack. <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content…

主流浏览器css兼容问题的总结

最近又搞了一波网站的兼容,由于要求ie浏览器还是要兼容到ie8,所以调起来还是各种蛋疼. 现在就post一些做兼容的总结,可能不够全面,但是可以告诉大家如何避过一些坑.主要测试了chrome,firefox,ie8.9.11,360浏览器. 一.基本的css兼容: 1.可能很多人喜欢用css hack的形式去兼容ie浏览器,但是我自己用起来感觉其实不好使 .ie7-就不考虑了,问题在哪呢,就在ie8的甑别上,你怎么让样式只对ie8起作用.上网搜你可能会得到这样的答案: .selector { c…

CSS兼容问题实用建议

CSS兼容问题,是美工最头痛的问题.做测试时,用谷哥和360浏览器(最新)都没有什么问题,用 IE6/IE8测试,问题就冒出来了.微软现在出IE10,我电脑上已经无法用IE6准确测试,IE-TESTER只能做参考作用.这个月,针对CSS兼容问题,总结了一些实用建议. 1.尽量少用margin属性,就算要用,也是在容器内用.一般IE6出问题,就是margin问题.不用margin, 怎么隔开DIV或其它容器?直接用高度,页面确定后,高度一般不变,所以高度写高点,就可以将它下面的块挤下去,留出空…

css兼容问题集合

css兼容问题兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白1px,下留白3px.解决方案:给文字设定 line-height .确保所有文字都有默认的 line-height 值. 2.ff下容器高度限定.即容器定义了height之后,容器边框的外形就确定了,不会被内容撑大,而ie下是会被内容撑大,高度限定失效.所以不要轻易给容器定义height. 3.…

CSS兼容常用技巧

请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 http://www.php100.com 2. margin加倍的问题设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案是在这个div里面加…

IE9以上 CSS文件因Mime类型不匹配而被忽略其他浏览器及IE8以下显示正常

什么是Mime类型? MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型就是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的时候,浏览器会自动使用指定应用程序来打开.多用于指定一些客户端自定义的文件名,以及一些媒体文件打开方式. 为什么会出现错误? 在IE9以上的IE浏览器中,尤其是本地环境下,在没有配置服务器的环境下,会遇到外链的CSS文件无法加载成功,而导致想要的效果没有实现!当你遇到这样的问题时,你…

Normalize.css源码注释翻译&浏览器css兼容问题的理解

版本v5.0.0源码地址: https://necolas.github.io/normalize.css/5.0.0/normalize.css 翻译版: /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ /** * 1. 更改所有浏览器中的默认字体系列(意见). * 2. 更正所有浏览器中的行高. * 3. 在Windows Phone的IE或者ios上方向更改后,防止字体大小的调整. *…

css兼容技巧

CSS兼容常用技巧请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 http://www.php100.com 2. margin加倍的问题设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案…

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…

浏览器CSS兼容

一.<important 在IE6及FF中的使用>.box1 {width:150px !important;} .box1 {width:250px;} !important是说这个设置有优先级,IE碰到!important不会出错只是忽略他的功能,假如后面又设置了width,IE会以最后设置的 width为准,假如后面再没有其它设置,则会用当前这个值,也就是前面的!important那个值.比如:#test {width: 300px !important }IE与FF都显示300PX.假…

CSS兼容问题资料汇集

CSS兼容问题一直困扰着CSSer,面对各浏览器,往往感觉束手无策,愁眉不展.CSS Hack是在标准CSS没办法兼容各浏览器显示效果时才会用上的补救方法,在各浏览器厂商解析CSS没有达成一致前,我们只能用这样的方法来完成这样的任务. 我进行前端开发的时候,测试用的浏览器大致有: IE7.IE6.Opera9(文章撰写时版本为9.25 8825),Safari3(文章撰写时版本为3.0.4 523.15),Firefox2(文章撰写时版本为2.0.0.11)等. 在正常的 selector { …

IE9下css hack写法

ie9一出css hack也该更新,以前一直没关注,今天在内部参考群mxclion分享了IE9的css hack,拿出来也分享一下: select { background-color:red\0; /* ie 8/9*/ background-color:blue\9\0; /* ie 9*/ *background-color:#dddd00; /* ie 7*/ _background-color:#CDCDCD; /* ie 6*/ } 注意写hack的顺序,其中: background…

css兼容各个浏览器的三角形图标

css兼容各个浏览器的三角形图标在当前流行的的网站上,我们经常会看到一些小三角形的下拉提示(微博顶部的下拉菜单),简单的方式可以使用一张图片代替,但是随着前端技术的发展,以及开发者对于前端性能的“吹毛求疵”,越来越多的前端开发者开始“返璞归真”,在能不使用图片的场景中减少图片使用,css图标相对于图片还有个优势是我们可以方便的定制图标的大小以及颜色. css实现三角形图标已不是什么新鲜技术,之前也有很多相关的技术文章,这篇文章主要是分析下在实际场景中使用时遇到的问题以及如何回避这些问题.基本原…

IE9的css hack

以前写过<IE8的css hack>,ie9一出css hack也该更新,以前一直没关注,今天在内部参考群mxclion分享了IE9的css hack,拿出来也分享一下: select { background-color:red\0; /* ie 8/9*/ background-color:blue\9\0; /* ie 9*/ *background-color:#dddd00; /* ie 7*/ _background-color:#CDCDCD; /* ie 6*/ } 注意写ha…

css兼容问题与实践归纳总结

css兼容问题与实践归纳总结一.IE6/7 原生块元素与display:inline-block; <div style="display:inline-block;">some text</div> 在ie6/7下,这个div还是会独占一行,所以要是需要设置inline-block的元素来呈现按钮图标之类的要素,最好用 span em i 等这些默认为内联元素的标签. 想起以前设置按钮时,也是吧 a 设置为 display:inline-block; 就可以…

针对IE的CSS样式hack

针对IE的CSS样式hack,如下: 例子:background:#000: 1.只针对IE6的hack方式(_):_background:#000: 2.只针对IE7的hack方式(+):+background:#000: 3.小于或等于IE7的hack方式(*):*background:#000: 4.大于或等于IE8的hack方式(\0):background:#000\0; 5.IE5-IE10都适用的hack方式(\9):background:#000\9;…

针对各种浏览器css不兼容的写法

/*针对谷歌浏览器内核支持的CSS样式*/@media screen and (-webkit-min-device-pixel-ratio:0) { 样式 } /*针对IE6特制识别的CSS样式*/*HTML .SearchBox{ 样式 } 针对Firefox浏览器的内核CSS写法:@-moz-document url-prefix() {.font1 {color:red}} IE8就是自己来调试了.调试一个浏览器,有不合适的地方可以在该内核css中重写对应的方法,只需把不合适的样式重写即…

CSS 兼容问题

CSS常见兼容性问题总结浏览器的兼容性问题通常是因为不同的浏览器对不同的代码有不同的解析造成页面显示不统一的情况,这里的浏览器通常指IE 6,7,8,9... Google Firefox Opera Safari,但更多的情况还是需要处理IE 6,7,8 Firefox的兼容问题. CSS Hack 为了让浏览器达到统一的显示效果,需要针对不同浏览器或者版本写出对应的可解析的CSS样式,所以把这个过程叫做CSS Hack CSS Hack 主要分为三种:IE条件注释.CSS属性前缀.选择器前…

IE9以下 placeholder兼容

//input placeholder兼容!(function ($, doc, win) { $.fn.placeholder = function () { var i = doc.createElement('input'), placeholdersupport = 'placeholder' in i; if (!placeholdersupport) { var inputs = $(this); inputs.each(function () { var input = $(thi…