html+css整理
tab：&emsp 空格： 
文本格式化：
1.上标和小标，<sup>和<sub>，如m³ m<sup>3</sup>
大屏展示，网页自动缩放
transform:scale(0.46875, 0.703125);
transform-origin :left top 0px
布局：
创建高级的布局非常耗时间，去网上寻找网站模板，并优化它是最好的办法。
利用float布局，利用有意义的元素进行清理。
子元素要使用绝对定位时，父元素要使用相对定位。才能相对于父元素进行绝对定位。
css:
1.背景图片可设置不随滚动条滚动，background-attachment:fixed
2.文本空白处理white-space
4.外边距合并
指的是，当两个垂直外边距相遇时，它们将形成一个外边距。
合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
5.特殊的css选择器，伪类伪元素，到w3cschool去查。
6.除非已经声明了 !DOCTYPE，否则使用 margin:auto 在 IE8 以及更早的版本中是无效的。
居中：margin:auto,text-align:center
注释：只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。
7.用backgroud来设置所有背景属性（不用backgroudcolor，image）
8.如果图片是页面的内容则用img，否则用background·
一次申明：
背景图 background: #ff0000 url(/i/eg_bg_03.gif) no-repeat fixed center;
列表样式 list-style: square inside url('/i/eg_arrow.gif')
字体 font:italic bold 12px/30px arial,sans-serif;
边框 border:1px solid #98bf21;
轮廓 outline:#00ff00 dotted thick;
css3边框图片
border-image:url(border.png) 30 30 round;
-moz-border-image:url(border.png) 30 30 round; /* 老的 Firefox */
-webkit-border-image:url(border.png) 30 30 round; /* Safari 和 Chrome */
-o-border-image:url(border.png) 30 30 round; /* Opera */
浏览器兼容性
一旦为页面设置了恰当的 DTD，大多数浏览器都会按照上面的图示来呈现内容。然而 IE 5 和 6 的呈现却是不正确的。根据 W3C 的规范，元素内容占据的空间是由 width 属性设置的，而内容周围的 padding 和 border 值是另外计算的。不幸的是，IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度，而是内容、内边距和边框的宽度的总和。
虽然有方法解决这个问题。但是目前最好的解决方案是回避这个问题。也就是，不要给元素添加具有指定宽度的内边距，而是尝试将内边距或外边距添加到元素的父元素和子元素。
当像这样对齐元素时，对 <body> 元素的外边距和内边距进行预定义是一个好主意。这样可以避免在不同的浏览器中出现可见的差异。
当使用 position 属性时，IE8 以及更早的版本存在一个问题。如果容器元素（在我们的案例中是 <div class="container">）设置了指定的宽度，并且省略了 !DOCTYPE 声明，那么 IE8 以及更早的版本会在右侧增加 17px 的外边距。这似乎是为滚动条预留的空间。当使用 position 属性时，请始终设置 !DOCTYPE 声明：
