用你说的身份证来说的 在PS里建一个这样的毫米尺寸的画布
然后ctrl+H 调出刻度尺 在刻度尺上右键 直接转换成PX像素单位
然后你就能得到一个物理的像素单位
然后网页里 就用这个PX（像素）作为单位 输出就行了
第一个问题，涉及到外边距折叠的问题。讲起来有点费劲，你需要理解的几点：
在CSS中，两个或以上的块元素（可能是兄弟，也可能不是）之间的相邻外边距可以被合并成一个单独的外边距。
处于同一个块级上下文中的块元素，没有行框、没有间隙、没有内边距和边框隔开它们，这样的元素垂直边缘毗邻，则称之为相邻。
折叠的边距取大的一个。
分析你的问题很明显边距已经折叠了，而且取的是#div2的margin-top，所以当发生边距折叠的时候不一定是兄弟元素，也有可能是包含关系的元素。关于margin建议你网上找《css探索之旅》的博客，大牛有N篇关于margin的文章，相信你看了就明白了。
第二个问题，float不会覆盖元素，其他受影响的元素都会在他后面排列。如果按照你的说法会覆盖的话，应该是用绝对定位，这样会有多层覆盖的效果。关于float建议你看《css权威指南》，里面讲的特别清楚，各种情况都有详细的分析。
希望能帮到你！
1. 可以使用SVG或者Canvas来代替CSP画布，它们都可以实现各种图形和动画效果。2. 可以使用HTML5中的新标签，如<video>、<audio>、<canvas>等来实现CSP画布的效果。
3. 可以使用CSS3中的新样式属性，如border-radius、box-shadow、gradient等来实现CSP画布的效果。
4. 可以使用JavaScript来实现CSP画布的效果，可以使用Canvas API绘制图形，也可以使用SVG API绘制图形。
