css浏览器兼容代码（css兼容性代码）

本篇文章给大家谈谈css浏览器兼容代码，以及css兼容性代码对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、怎么解决浏览器的css样式兼容问题
• 2、edge浏览器兼容代码的前缀是什么
• 3、CSS中不同浏览器兼容问题

怎么解决浏览器的css样式兼容问题

有两种方法：

1、在同一个CSS样式表中，使用 !important 来定义不同的值以适应Firefox和IE。

例如：

padding: 20px !important; /For Firefox/

padding: 10px; /For IE/

（注意这里IE6是无法识别，important 这个标记的，但它会识别padding: 20px，所以要在后面加上padding: 10px用来覆盖padding: 20px）这个方法适用于修改少量代码。

2、条件注释。（只对IE浏览器有效）这也是北极冰仔部落格目前使用的方法。先为不同浏览器书写各自的CSS样式，再在head中加入以下的代码以适应不同的IE浏览器版本调用：

注意：

gt: greater than （高于）

lte: less than or equal to （低于或等于）

另外：IE还支持一个非标准的标签：comment

This is not Internet Explorer.

This is Internet Explorer.

IE会自动把此标签中的内容当作注释处理掉。

扩展资料

关于css兼容性问题及一些常见问题

目前主流浏览器的兼容性做的都比较好了，以下主要针对IE6，7的不兼容问题进行解决。

1、有浮动存在时，计算一定要精确，不要让内容的宽高超出我们所设置的宽高，IE6下，内容会撑开设置好的高度。

解决方法：给对应的父级加overflow:hidden;但是会有部分被隐藏掉，最好是精确计算宽高再设定。

2、在IE6下有元素浮动时，如果宽度需要由内容撑开，就给里边的块元素都加浮动，正常浏览器不用加浮动。

3、在IE6下元素的高度的小于19px的时候，会被当做19px来处理。

解决办法：添加overflow:hidden;

edge浏览器兼容代码的前缀是什么

一、placeholder修改样式兼容性写法：

由于placeholder是h5新特性之一，目前还有兼容性问题，所以这样写以兼容各浏览器。

针对不同浏览器或不同版本的浏览器会有不同的写法，会添加相应的前缀。

注意：

1、WebKit, Blink, Edge浏览器等需要带上-webkit-前缀，且是双冒号，写的时候还要带上input

2、针对火狐浏览器则有两种写法，一种是针对低版本的，一种是针对高版本的，二者都需要带上-moz-前缀。要点1：火狐低版本的使用冒号（：），而高版本的使用双冒号（：：）；要点2：火狐浏览器不需要像webkit内核那样要带上input。

3、由于placeholder属性只在IE10+才支持，因此，针对IE10、IE11的写法是加上-ms-前缀，使用的是冒号（：），需要带上input

特别强调：冒号与双冒号的问题，还有是否需要加上input

作者：江峰★ 出处：

打开CSDN，阅读体验更佳

css兼容性写法大全_前端独秀的博客

css兼容性写法大全 淘宝初始化代码 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li,pre, form, fieldset, legend, button, input, textarea, th, td {margin:0;padding:0; }...

继续访问

css 兼容性写法,CSS hack写法_weixin_34112208的博客

一、CSS hack写法 书写顺序为FireFox在最前,其次是IE8、IE7,最后是IE6。 color:red;//所有浏览器 color:blue\9;//所有IE +color:orange;//IE7 _color:green;//IE6 eg1. 若浏览器为FireFox,那么color:red;若浏览器为IE8,...

继续访问

各浏览器css兼容写法

各浏览器css兼容写法各浏览器css兼容写法

如何解决placeholder的兼容性

placeholder在不支持html5的低版本的浏览器中，placeholder属性是无效的，例如ie9及以下的ie浏览器不兼容这个属性。下面介绍placeholder兼容性的处理 在页面添加如下脚本 $(function() { // 如果不支持placeholder，用jQuery来完成 if(!isSupportPlaceholder()) { // 遍历所有in

继续访问

CSS浏览器前缀兼容写法_梦凝哲雪的博客_css兼容前缀

CSS浏览器前缀兼容写法 Vendor prefix—浏览器引擎前缀,是一些放在CSS属性前的小字符串,用来确保这种属性只在特定的浏览器渲染引擎下才能识别和生效。 该图来自简书沈龙 浏览器引擎前缀(Vendor Prefix)有哪些?

继续访问

CSS 各浏览器兼容写法(CSS HACK)_caspar笔记的博客

CSS Hack大致有3种表现形式,CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack,CSS Hack主要针对IE浏览器。 类内部Hack:比如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",而firefox两个都不...

继续访问

html+placeholder+兼容问题,placeholder属性做兼容性处理

placeholder是html5新增的一个属性，当input或者textarea设置了该属性后，该值的内容将作为灰字提示显示在文本框中，当文本框获得焦点(或输入内容)时，提示文字消失。但是在不支持html5的低版本的浏览器中，placeholder属性是无效的，例如ie9及以下的ie浏览器不兼容这个属性。下面介绍placeholder兼容性的处理效果：...

继续访问

css兼容写法

css3 1.box-shadow: filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*兼容ie*/ -moz-box-shadow: 2px 2px 10px #909090;/*兼容firefox*/ -webkit-box-shadow: 2p...

继续访问

css 兼容解决方案,css兼容性处理方案

css兼容性处理方案首先是对于兼容性的理解。不同浏览器之间的兼容+同一浏览器，不同版本之间的兼容。解决方案主要有以下四种：1 浏览器CSS样式初始化对padding和margin，以及line-height等在全局初始化，统一不同浏览器之间的差异。举例：* {margin: 0;padding: 0;}html {line-height: 1.15;-webkit-text-size-adjust...

继续访问

三分钟速记CSS兼容写法

CSS兼容浏览器的写法 主要是坑爹的IE浏览器，身为前端开发在写PC端项目的时候，需要在CSS样式上进行最基本最简单的样式适配的方法，这些也是必要掌握的。 文章目录CSS兼容浏览器的写法前言一、兼容不同浏览器1、针对不同内核基本的浏览器的兼容写法二、CSS Hack总结 前言 本篇文章主要总结了简单的及常用的CSS样式的兼容写法。 一、兼容不同浏览器 1、针对不同内核基本的浏览器的兼容写法 -webkit-：safari、chrome -moz- ：firefox -ms- ：ie -o-

继续访问

浏览器不能切html样式,css不同浏览器兼容性问题怎么解决？

浏览器的兼容性问题是Web前端开发人员经常会碰到的和必须要解决的问题。那么css不同浏览器兼容性问题怎么解决？下面本篇文章就来给大家介绍一下，希望对大家有所帮助。css不同浏览器兼容性问题的解决方案1. 浏览器CSS样式初始化由于每个浏览器的css默认样式不尽相同，所以最简单有效的方式就是对其进行初始化，相信很多朋友都写过这样的代码，在所有CSS开始前，先把marin和padding都设为0，以防...

继续访问

各浏览器兼容css写法

/* 针对Chrome谷歌浏览器内核支持的CSS样式 */ @media screen and (-webkit-min-device-pixel-ratio:0) { 样式 /* 例如 .font1 {color:red} / } 针对Firefox浏览器的内核CSS写法： @-moz-document url-prefix(){ 样式 / 例如 .font1 {color:red} / } ...

继续访问

css的兼容性写法

各浏览器兼容性css写法/* 针对Chrome谷歌浏览器内核支持的CSS样式 */@media screen and (-webkit-min-device-pixel-ratio:0) { 样式 /* 例如 .font1 {color:red} */}针对Firefox浏览器的内核CSS写法：@-moz-document url-prefix(){ 样式 /* 例如 .f

继续访问

最新发布 浏览器兼容css_CSS 样式浏览器前缀兼容性写法、生效写法

浏览器兼容css_CSS 样式浏览器前缀兼容性写法、生效写法

继续访问

CSS 中的字体兼容写法：用CSS为英文和中文字体分别设置不同的字体

font-family的调用方法： font-family:Arial,'Times New Roman','Microsoft YaHei',SimHei; font:bold 12px/0.75em Arial,'Times New Roman','Microsoft YaHei',SimHei; 根据font-family的原则，假如客户终端不认识前面的字体，就自动切换到第...

继续访问

ie浏览器样式兼容写法_常见的CSS样式兼容性写法

1. 设置透明度在IE6中使用 filter: alpha(opacity = 40);在其他浏览器中使用 opacity: 0.4;2. 设置行高/*\9表示兼容所有的IE浏览器*/line-height: 35px\9;3. 清除浮动.clearfix:after {content: '';height: 0;clear: both;overflow: hidden;visibility: h...

继续访问

CSS兼容写法整理

css3(含ie9以下) 1.box-shadow： filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*兼容ie*/ -moz-box-shadow: 2px 2px 10px #909090;/*兼容firefox*/ -webkit-box-shado

继续访问

placeholder的简单使用

placeholder就是用户名密码框未输入内容时,默认显示的灰色文字。 如下图效果： !DOCTYPE html html head meta charset="utf-8" titleplaceholder效果演示(runoob.com)/title /head l...

继续访问

css兼容性写法大全

淘宝初始化代码 body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;} body,button,input,sel...

继续访问

热门推荐 css ie6,ie7,ie8 兼容性写法,CSS hack写法

margin-bottom:40px; /*ff的属性*/ margin-bottom:140px\9; /* IE6/7/8的属性 */ color:red\0; /* IE8支持 */ *margin-bottom:450px; /*IE6/7的属性*/ +margin-bottom:450px; _color:#ff0000;

继续访问

浏览器兼容的css写法

1. IE6、IE7、IE8兼容写法 _color: #ccc; /* _只ie6支持 */ *color: #ccc; /* *ie6/7支持 */ *+color: #ccc; /* *+ie7支持 */ color: #ccc\0; /* \0 IE8支持 */ color: #ccc\9; /* \9 IE

继续访问

css 兼容 ie

首先，我在把 ie 浏览器更新到 11 后，在 f12 调试工具中发现一片空白，解决方法如下： 安装补丁： 64位的系统应该使用下面这个补丁： 32位的系统应该使用下面这个补丁：...

继续访问

css中属性兼容性写法,CSS3兼容属性和标准属性的书写顺序

一、不同书写顺序示例首先个人推荐的正确写法：//标准属性放在兼容属性之后-webkit-border-radius: 10px 30px;border-radius:10px 30px;容易产生问题的错误写法：//标准属性放在兼容属性之前border-radius:10px 30px;-webkit-border-radius: 10px 30px;二、实例说明1.实例实例1.1(正确写法)：Do...

继续访问

几种css属性兼容性写法

css属性兼容性写法，兼容低版本主流浏览器

继续访问

css兼容写法

CSS中不同浏览器兼容问题

一、CSS HACK

1, !important

随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)

以下为引用的内容：

2, IE6/IE7对FireFox

以下为引用的内容：*+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签.

注意:*+html 对IE7的HACK 必须保证HTML顶部有如下声明：

二、万能 float 闭合

关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup]将以下代码加入Global CSS 中,给需要闭合的div加上 class=”clearfix” 即可,屡试不爽.

以下为引用的内容：

三、其他兼容技巧

1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 如width:115px !important;width:120px;padding:5px;

　必须注意的是， !important; 一定要在前面。 2, 居中问题.1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vertical-align: middle.( 注意内容不要换行.)2).水平居中. margin: 0 auto;(当然不是万能)3, 若需给 a 标签内内容加上 样式, 需要设置 display: block;(常见于导航标签)4, FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题.5, ul 标签在 FF 下面默认有 list-style 和 padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表)6, 作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应.7, 关于手形光标. cursor: pointer. 而hand 只适用于 IE.

关于css浏览器兼容代码和css兼容性代码的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。