小数在各个浏览器的差异及css用小数解析差异解决浏览器兼容性问题


通常我们写 css 的时候写的数字都是整数,如 font-size:12px; margin:20px; 那么看到标题可能有人会问,css 属性值可以有小数点么?如果是小数那会显示成什么样子?和整数有什么区别?
首先我们先看个例子,通过例子来观察下小数在各个浏览器的差异。

复制代码
代码如下:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>decimal</title>
<style type="text/css">
body{font-family:SimSun;text-align:center;}
p{margin:20px;height:30px;}
.font11-9{font-size:11.9px;}
.font11-4{font-size:11.4px;}
</style>
</head>
<body>
<p class="font11-9">这段文字的大小是11.9像素。</p>
<p class="font11-4">这段文字的大小是11.4像素。</p>
</body>
</html>

我们可以看出在 chrome,firefox,ie8 下小数会通过四舍五入的方式转成整数,而 ie6,ie7 会对小数进行下限取整转成整数。通过这一特性我们在某些情况下,用小数来替代 css hack。譬如:

复制代码
代码如下:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>decimal</title>
<style type="text/css">
body{font-family:SimSun;font-size:30px;}
.black{background:black;width:500px;height:500px;margin-left:auto;margin-right:auto;overflow:hidden;color:white;}
.white{background:white;width:100px;height:100px;margin:0.9px;}
</style>
</head>
<body>
<div class="black">
<div class="white"></div>
<p>在ie6,ie7下红色块离黑色块没有外边距,而其他的浏览器则有 1px 外边距。一般我们是写css hack,如margin:1px;*margin:0;但是我们现在可以通过小数来解决啦。</p>
</div>
</body>
</html>

不仅仅缩短的代码的长度,还去掉了 css hack。
总结:虽说这个小数解决一些兼容性问题很神奇,但是它的缺点也很明显,就是适用范围,只能解决相差1像素的浏览器差异,只能解决 ie6,ie7 下值小1像素的浏览器差异。
浏览器:chrome,firefox,ie8,ie7,ie6



相关阅读:
SDK已面向Win10发布 支持插播视频
Android Activity启动模式之singleTask实例详解
Win10隐藏空的光盘、软盘等驱动器图标的方法
C#使用开源驱动连接操作MySQL数据库
详细谈谈javascript的对象
MAC系统VLC播放1080P电影卡顿的两种解决方法
Fedora 13 正式版安装教程[图文]
C#获取存储过程返回值和输出参数值的方法
如何判断php数组的维度
AngularJS ng-bind-template 指令详解
CentOS 6.3下使用Gitosis安装搭建Git Server教程
Oracle查看和修改连接数(进程/会话/并发等等)
php中 ob_start等函数截取标准输出的方法
Discuz7.2版的faq.php SQL注入漏洞分析
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 浩良河-杨柳青 呼兰-哈达阳 十堰-固始 孔庄-西阳村 吴堡-浩良河 郑州-北碚 邢台东-徐州东 大营镇-商丘南 卓资东-阿贵图 宜兴-定远 武当山-贵阳 虞城县-定西 光山-信丰 瑞安-徐州东 包头东-唐山北 柴沟堡-银川 咸阳-太原 二龙山屯-赵光 杭州东-向塘 焦作-沙河市 郑州-石家庄 四合永-高林屯 北京南-杭州东 黄口-耒阳 红彦-江桥 高头-绣峰 清远-郴州西 吉首-镇平 玉屏-北京 泗阳-德州 任丘-旬阳北 吴桥-太原 泰康-甘旗卡 新立屯-兴隆县 苏州-泊头 三道湖-东通化 海城-沧州 前进镇-红兴隆 呼和浩特东-文水 涿州-四合永 晋州-临城 安达-鲁河 南召-关林 苏州北-新余北 蒲城东-灵宝 阳澄湖-南京南 天津西-溧阳 溆浦-四平 井冈山-淄博 佛山-河源 缙云-马鞍山 泉州-昆山南 汤阴-沙河市 介休-太原东 长兴-宜兴 哈尔滨东-绥棱 米易-峨边 乃林-风水沟 溧阳-南靖 秀山-桂林 西胡尔清-牙拉盖图 东胜西-达拉特西 黎塘-镇江 济南西-灵宝西 长春-庆安 十里坪-和龙 融安-陇西 云梦-鄂州 灯塔-老边 固始-六安 高台-双城堡 兰考南-婺源 宜宾-娄底 双城堡-大石桥 怀化南-松江南 上海-丹阳 蓬安-安陆 福州南-古田北 焦作-徐州东 吐鲁番-滁州北 阳新到深圳的火车列车票是多少钱
从湖南常德到山东烟台需要几天?
从南京经京沪高速到大港油田怎么坐车
随身携带欧莱雅或者玉兰油这些膏体化妆品嘛我是从昆明机
现在济南火车列车站提前几天售票,要买11号去南京的动车票,几号
上海到武当山多远怎么走
我在辽阳买的卧铺票到大连,这个车是2062次加格达奇到大连的
K45从北京到德州的提前几天买票
龙岩哪里有捷安特电动车专卖
请问嘉兴列车火车站出发到宁波列车火车站,是那里下车的
莆田的户口,以前读书迁到厦门,现在想迁回莆田,想问下这个
表妹从仁川回青岛,是在大港下船,我住在城阳,有什么公交车
承德世纪城承德世纪城的房价在高铁修通时能突破10000吗
谁知道苏州到丹东的多少钱呢坐火车
我要到朝鲜 急知道那的环境 习惯 生活
急,急,急南昌买火车列车票的问题
什川桃园
从武汉到佛山几点的列车火车。票价是多少
急泰州汽车南站到泰兴的时刻表最后一班是几点啊
天津至河南省方城县柳河乡关沟村北城庄的最近行车路线
暑假想去福建南平武夷山旅游求详细路线
从兰州去石河子请问坐西安到奎屯的火车列车近,还是坐兰州到乌
8月30日晚从南昌飞往上海的飞机是否停靠杭州
赤峰至鞍山怎么坐车省钱?来回多少钱
台州临海到成都的交通方法
家嘴去浦东机场什么办法最便宜,而且可以在两个半小时内到
能在许昌买郑州火车列车站到成都的票吗
从吉林江北火车列车站到吉林市船营区第二十五小学怎么乘车
巫溪到重庆的客车一天有几班?几点发车可以提前买吗
K8082到钟祥站的时间

Copyright © 2016 phpStudy |