css calc ie不兼容怎么处理

2024-08-16

CSS-calc 兼容写法

width: 90%;/*写给不支持calc()的浏览器*/ width:-moz-calc(100% - (10px + 5px) * 2); width:-webkit-calc(100% - (10px + 5px) * 2); width: calc(100% - (10px + 5px) * 2); 我们想要实现页面自适应布局时,通常因为margin的存在,而比较麻烦:有时候想要实现宽度自适应的输入框时,也因为padding或margin的存在,而相当繁琐,同时由于浏览器兼容性而导致最

IE10 CSS hack，IE兼容问题

IE10 CSS hack,IE兼容问题作者: 雪影发表于2013 年 4 月 25 日分类:技术分享 | 暂无评论 | 人气: 376 度首先,ie10不支持条件注释了. 方法一:特性检测:@cc_on 我们可以用IE私有的条件编译(conditional compilation)结合条件注释来提供针对ie10的Hack: <!--[if !IE]><!--<script> if (/*@cc_on!@*/false) { document.docume

css calc()

w https://developer.mozilla.org/en-US/docs/Web/CSS/calc The calc() CSS function can be used anywhere a <length>, <frequency>, <angle>, <time>, <number>, or <integer> is required. With calc(), you can perform calculation

[CSS3] Create a fixed-fluid-fixed layout using CSS calc()

CSS calc() allows you to mix and match units to get real-time calculations. It's useful when you need to size elements but you have some unknown number that you have to account for.

css 完美垂直居中解决方案兼容ie8以上等其他浏览器

css 完美垂直居中解决方案兼容ie8以上等其他浏览器 <pre><!DOCTYPE html><html><head> <title>DIV水平垂直居中 </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"&

纯css实现省略号，兼容火狐，IE9，chrome

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>多行文本实现省略号显示</title> </head> <style type="text/css"> /*纯css实现省略号,兼容火狐,IE9,chrome*/ .wrap{ height:40px;line-h

HTML+CSS布局技巧及兼容问题【阅读季】

在IE6和IE7中,行高值必须大于字体的2px以上才能保证字体的完整显示或当作为链接时能显示下划线. IE6 下去掉 input等元素的边框 border: 0 none; 所有浏览器都可以了边框1px {td不重叠状态}:border-collapse: collapse;(table.td需同时设置) IE6.7边框断续:{min-height:1px; _height:1px;}或{zoom:1:overflow:hidden;}均可解决 IE6.7.8 FF 兼容透明:filter:

浅谈CSS hack（浏览器兼容）

今天简单写一点关于浏览器兼容的处理方法,虽然百度上已经有很多,但是我还是要写! 先看一个图这个图描述了2016年1月至8月网民们所使用的浏览器市场份额(来源:http://tongji.baidu.com/data/browser).令我感到欣慰的是chrome排第一,chrome一直以来对W3C标准都支持得比较友好,但是图中也反映了使用IE系列的人数也不少,所以我们日常做前端开发的时候还要考虑他们的感受. 以下是正文: 我的前任公司做前端的时候,要求兼容IE8及以上,谷歌,火狐三座大山.因为

css中的一些兼容问题

浏览器兼容为什么会有兼容问题? 由于市场上浏览器种类众多,而不同浏览器其内核亦不尽相同,所以各个浏览器对网页的解析就有一定出入,这也是导致浏览器兼容问题出现的主要原因,我们的网页需要在主流浏览器上正常运行,就需要做好浏览器兼容.现在市面上使用较多的内核例如: 使用Trident内核的浏览器:IE.Maxthon.TT: 使用Gecko内核的浏览器:Netcape6及以上版本.FireFox: 使用Presto内核的浏览器:Opera7及以上版本: 使用Webkit内核的浏览器:Safari.C

细微之处：比较两种CSS清除浮动的兼容

http://www.cnblogs.com/bienfantaisie/archive/2011/05/27/2059597.html 清除浮动是连续浮动元素之后的必备工作,在工作中我做到需要清除浮动的地方都要清除. 比如,我在瑞星的项目中一直这样使用: .clear:after{content:'\0020';display:block;height:0;clear:both} .clear{*zoom:1} 观察腾讯微博项目,并不是每个浮动必须清除,但是如果内部元素连续浮动,其外部元素必然

怎么用一行代码解决CSS各种IE各种兼容问题

用一行代码来解决CSS在,IE6,IE7,IE8,IE9,IE10 中的各种兼容性问题. 在网站前端写代码的过程中,很多时间IE各个版本的兼容问题很难整.现在百度与谷歌都有了一行解决这种兼容性的代码了.如下面的. 办法一百度也应用了这种方案去解决IE的兼容问题百度源代码如下 1 <!Doctype html> 2 <htmlxmlns=http://www.w3.org/1999/xhtmlxmlns:bd=http://www.baidu.com/2010/xbdml>; 3

解决CSS各种IE各种兼容问题(Google解决方案)

google的 ie7 – js中是一个JavaScript库(解决IE与W3C标准的冲突的JS库),使微软的Internet Explorer的行为像一个Web标准兼容的浏览器,支持更多的W3C标准,支持CSS2.CSS3选择器.它修复了许多的HTML和CSS问题,并使得透明PNG在IE5.IE6下正确显示. 使IE5,IE6兼容到IE7模式(推荐) <!–[if lt IE 7]> <script src=”http://ie7-js.googlecode.com/svn/versi

浮出层的css写法，完美兼容IE6~10

利用元素间的绝对定位差一像素,使用不同颜色做出浮出层小三角的效果,完美兼容各浏览器! html部分: <div class="poptip"> <span class="poptip-arrow poptip-arrow-top"><em>◆</em><i>◆</i></span> <span class="poptip-arrow poptip-arrow-righ

【css老版本浏览器兼容利器】ie-css3.htc

做前端的同学都应该听说或者用过,是一段脚本,可以让ie实现css3里的圆角和阴影效果. css带来的便利是很容易感受的到的,但恶心的是它在ie下的不兼容,所以某位牛人现身写了个ie-css3.htc,允许你在ie下去使用css3的部分东西. ie-css3的使用方法很简单,在你需要使用css3的样式里加入behavior: url(js/ie-css3.htc);就可以了(括号里是ie-css3.htc的地址) ie-css3.htc http://fetchak.com/ie-css3/ 用法

CSS在不同浏览器兼容问题,margin偏移/offset溢出等

margin在垂直取值时取最大值 <!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><meta http-equiv=

利用IE/FF的不同识别CSS来使用浏览器兼容问题

区别IE6与FF: background:orange;*background:blue; 区别IE6与IE7: background:green !important;background:blue; 区别IE7与FF: background:orange; *background:green; 区别FF,IE7,IE6: background:orange;*background:green !important;*background:blue; 注:IE都能识别*;标准浏览器(如FF

DIV+CSS相对IE8的兼容问题

CSS技巧: 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2. margin加倍的问题设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案是在这个div里面加上display:inline; 例如:<#div id=”imfloat”> 相应的css为 #IamFloat{float:left; m

CSS Hack (各个浏览器兼容的问题)

写css样式的时候,恐怕最头疼的就是各个浏览器下的兼容性问题,即css hack,明明感觉应该是对的,但是就是出不来效果,我根据平时所接触的,总结一下关于兼容性的技巧,希望可以对大家有所帮助…… CSS Hack的原理是什么由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系.我们就可以根据这个来针对不同的浏览器来写不同的CSS. CSS Hack大致有3种表现形式,CSS类内部Hack.选择器Hack以及HTML头部引用(if IE)Hack,CSS Hack主要针

ie6,ie7,ie8 css bug汇总以及兼容解决方法

1:li边距“无故”增加任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是由于其低级元素ul的padding引起,padding的上下值对li有影响,左右无影响.所以只好笨手笨脚地把padding去掉,换成margin.这是能解决问题,但往往不是我们想要的结果,或许还会引起其他不必要的怪现象. 解决这个问题的方法,其实很简单,既然是有ul引起的,就设置ul的显示形

在不同的浏览器使用不同的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 多行省略号兼容移动端

浏览器兼容css样式 -webkit-line-clamp: ; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; text-overflow: -o-ellipsis-lastline; line-clamp: ; -webkit-box-orient: vertical; css 样式在移动端不兼容可判断移动端两行有多少文字,大于2行文字总数时截取字符串,然后添加省略号 <div ? item.advise :

css calc ie不兼容怎么处理

热门专题