CSS 小数 处理

简介: 在不同浏览器或者同一浏览器的不同版本中,CSS 都会对小数进行取整(直接去除小数还是会根据小数的大小进行判断就不一定了) 测试代码:<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8

在不同浏览器或者同一浏览器的不同版本中,CSS 都会对小数进行取整(直接去除小数还是会根据小数的大小进行判断就不一定了)
测试代码:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <style type="text/css">
        .class1 {
            width: 10.1px;
            height: 10.8px;
            border: 0px;
            background-color: Black;
        }
    </style>
    <script type="text/javascript">
        window.onload = function () {
            var div1 = document.getElementById("div1");
            var clientWidth = div1.clientWidth;
            var offsetWidth = div1.offsetWidth;
            var scrollWidth = div1.scrollWidth;
            var ul = document.createElement('ul');
            var oLi1 = document.createElement('li');
            oLi1.innerHTML = "div.clientWidth=" + clientWidth;
            ul.appendChild(oLi1);
            var oLi2 = document.createElement('li');
            oLi2.innerHTML = "div.offsetWidth=" + offsetWidth;
            ul.appendChild(oLi2);
            var oLi3 = document.createElement('li');
            oLi3.innerHTML = "div.scrollWidth=" + scrollWidth;
            ul.appendChild(oLi3);


            var clientHeight = div1.clientHeight;
            var offsetHeight = div1.offsetHeight;
            var scrollHeight = div1.scrollHeight;
            var oLi4 = document.createElement('li');
            oLi4.innerHTML = "div.clientHeight=" + clientHeight;
            ul.appendChild(oLi4);
            var oLi5 = document.createElement('li');
            oLi5.innerHTML = "div.offsetHeight=" + offsetHeight;
            ul.appendChild(oLi5);
            var oLi6 = document.createElement('li');
            oLi6.innerHTML = "div.scrollHeight=" + scrollHeight;
            ul.appendChild(oLi6);
            div1.appendChild(ul);            
        }
    </script>
</head>
<body>
    <div id="div1" class="class1">
    </div>
</body>
</html>

测试结果:
这里写图片描述
这里写图片描述
这里写图片描述

作者:jiankunking 出处:http://blog.csdn.net/jiankunking

目录
相关文章
|
23天前
|
Web App开发 前端开发 iOS开发
css3
css3
18 4
|
5月前
|
前端开发
CSS知识文章
CSS知识文章
|
前端开发 容器
CSS——每周总结
CSS——每周总结
CSS——每周总结
|
10月前
|
Web App开发 前端开发 图形学
CSS 20大酷刑(一)
CSS 20大酷刑(一)
|
12月前
|
XML 前端开发 UED
CSS基本讲解与使用(详解)
CSS基本讲解与使用(详解)
|
Web App开发 前端开发
常用 CSS(上)
常用 CSS(上)
118 0
常用 CSS(上)
|
前端开发 容器
CSS总结(下)
CSS总结(下)
131 0
CSS总结(下)
|
前端开发 容器
CSS 实现切角效果
CSS 实现切角效果
CSS 实现切角效果
|
前端开发 JavaScript 搜索推荐
CSS3
HTML+CSS+JavaScript 结构 + 表现 + 交互 什么是CSS 如何学习 CSS是什么 CSS怎么样(快速入门) CSS选择器(重点 + 难点) 美化网页(文字,阴影,超链接,列表,渐变...) 盒子模型 浮动 定位 网页动画(特效效果) 什么是CSS Cascading Style