【CSS】怎么解决浏览器兼容性问题

  【CSS】怎么解决浏览器兼容性问题

  工具/原料

  Dreamweaver

  CSS

  方法/步骤

  不同浏览器对HTML标记所具有的内外边距属性具有不同的定义。

  因此如果想消除这种差距,应该在相应的CSS部分加入以下CSS代码:

  *{margin:0px;padding:0px;}

  借于此,所有标记的内外边距被统一起来。

  

  

  优先级问题:

  对于同一标记属性所给定的值,有不同的优先级。其中优先级最高的是内联代码,其实是页内CSS,接下来是浏览器默认设置,最后才是外部CSS所做的限制。

  

  Margin不一致的问题:

  当有多张图片需要排在一行时,我们通常使用“Float:Left”来实现,这样一来,浏览器就存在兼容性问题。导致图片与后面的内容存在margin不一致的问题。对此一种解决方法就是给图片添加“Display:inline”项即可。

  DIV居中问题:

  通常我们会利用“vertical-align:middle”来实现,这对于搜狗浏览器来说,是正常的,但是对于IE浏览器来说,却并没有效果。对此,一种较好的解决方法是:将文字的行高设置与DIV一样时即可解决问题。

  

  

  内外边框合并问题。通常情况下,对于两个相关DIV块,相邻时采用外边距合并原则,其结果只最两个DIV块中Margin最大值做为两个DIV之间的间距。包含的两个DIV之间的间距也遵行同样的规则。

  掌握了这一规则,在利用DIV块进行布局时我们就可以做的更加得心应手。

来自网络

时间: 2024-12-24 22:38:54

【CSS】怎么解决浏览器兼容性问题的相关文章

怎么解决浏览器兼容性问题

怎么解决浏览器兼容性问题 所有浏览器 通用 height: 100px;IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7.FF 共用 height: 100px !important; 1.内外边距被统一: 不同浏览器对HTML标记所具有的内外边距属性具有不同的定义.因此如果想消除这种差距,应该在相应的CSS部分加入以下CSS代码:*{margin:0px;padding:0px;}借于此,所有标记

利用小数解析差异解决浏览器兼容性问题

通常我们写 css 的时候写的数字都是整数,如 font-size:12px; margin:20px; 那么看到标题可能有人会问,css 属性值可以有小数点么?如果是小数那会显示成什么样子?和整数有什么区别? 首先我们先看个例子,通过例子来观察下小数在各个浏览器的差异. <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <titl

解决浏览器兼容性问题

每次做完一个界面功能,用不同浏览器测试. 解决浏览器兼容性问题

css中常见浏览器兼容性问题

浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率:100% 解决方案:CSS里 *{margin:0;padding:0;} 备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0. 浏览器兼容问题二:块属性标签float后,又有横行的margin情况下,在IE6显示 margin比设置的大 问题症状:常见症状是I

css专题学习-浏览器兼容性问题目录

此帖是我所分享的浏览器兼容性问题相关的所有目录. [分享]浏览器兼容性问题综述 -- 正确的认识浏览器兼容性问题 [分享]你的元素居中对齐了吗? --- 关于 'text-align:center' 的问题 [分享]<a>标签的伪类书写顺序问题 [分享]IE6 中 A 标签 hover 伪类特殊性过高的问题 [分享]深入挖掘document.getElementsByTagName()方法的返回值 [分享]警惕你的 Date 对象 [分享]重新认识IE盒模型bug [分享]你知道吗?--- 表

sass转css并处理浏览器兼容性

一.大前提,你必须安装必备的环境 node.js 安装cnpm解决下载卡顿 命令:npm install -g cnpm --registry=https://registry.npm.taobao.org 查看官网api:https://www.gulpjs.com.cn/docs/getting-started/quick-start/ 安装gulp 查看官网api:npm install --global gulp-cli 查看官网api:https://www.gulpjs.com.cn

在不同的浏览器使用不同的css样式,解决浏览器兼容问题

区别IE6与FF:       background:orange;       *background:blue; 区别IE6与IE7:       background:green !important;       background:blue; 区别IE7与FF:       background:orange;        *background:green;       方法一:在同一个CSS样式表中,使用 !important 来定义不同的值以适应Firefox和IE,例如:

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

/* CSS属性级Hack */ color:red; /* 所有浏览器可识别*/ _color:red; /* 仅IE6 识别 */ *color:red; /* IE6.IE7 识别 */ +color:red; /* IE6.IE7 识别 */ *+color:red; /* IE6.IE7 识别 */ [color:red; /* IE6.IE7 识别 */ color:red\9; /* IE6.IE7.IE8.IE9 识别 */ color:red\0; /* IE8.IE9 识别*

WEB前端解决浏览器兼容性问题

1.HTML对象获取问题 FireFox:document.getElementById("idName"); ie:document.idname或者document.getElementById("idName"). 解决办法:统一使用document.getElementById("idName"); 2.const问题 说明:Firefox下,可以使用const关键字或var关键字来定义常量; IE下,只能使用var关键字来定义常量. 解