css 兼容 css3兼容

1.css 兼容

padding:10px;
padding:9px\9; /* all ie */
padding:8px\0; /* ie8-9 */
*padding:5px; /* ie6-7 */
+padding:7px; /* ie7 */
_padding:6px; /* ie6 */

2.css3 兼容

/*蓝色发光文本框*/
.txt_blueBorder
{
    line-height: 24px;
    border: 1px solid #C7C7C7;
    padding-left: 5px;
    -webkit-box-shadow: inset 0 5px 1px rgba(0,0,0,0.075);
    -moz-box-shadow: inset 0 5px 1px rgba(0,0,0,0.075);
    -o-box-shadow: inset 0 5px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 5px rgba(0,0,0,0.075);
    -webkit-transition: border linear .2s, box-shadow linear .2s;
    -moz-transition: border linear .2s, box-shadow linear .2s;
    -o-transition: border linear .2s, box-shadow linear .2s;
    transition: border linear .2s, box-shadow linear .2s;
}


.txt_blueBorder:focus
{
    border-color: #E6433F;
    border-color: #0866c6\9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #E6433F;
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #E6433F;
    -o-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #E6433F;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #E6433F;
}

-moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari 和 Chrome */
  border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */


  -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
  -webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */
  box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */

值	描述
h-shadow	必需。水平阴影的位置。允许负值。
v-shadow	必需。垂直阴影的位置。允许负值。
blur	可选。模糊距离。
spread	可选。阴影的尺寸。
color	可选。阴影的颜色。请参阅 CSS 颜色值。
inset	可选。将外部阴影 (outset) 改为内部阴影。

实现透明
父div：
background:rgba(0, 0, 0, 0.5)!important;
filter:Alpha(opacity=50); 
background:#000;
子div:position:relative;

rgba()和opacity都能实现透明效果，但最大的不同是opacity作用于元素，以及元素内的所有内容的透明度，

而rgba()只作用于元素的颜色或其背景色

两端对齐
text-align:justify;
text-indent: 2em;
letter-spacing: 1px; 
word-spacing: 1px;

鼠标浮上去显示图片

.weixin img{
display:block;
width:128px;
position:absolute;
left:620px;
top:25px;
visibility:hidden;
opacity:0;
-webkit-transition:all 1s;
-moz-transition:all 1s;
-o-transition:all 1s;
transition:all 1s;
}
.weixin:hover img{
visibility:visible;
top:10px;
opacity:1;
}