電腦版在手機上顯示不對齊

解決方法：

因為，每個橫向層的寬度不同，所以對不起，在每個容器Z外層加入樣式 nb class，簡稱牛B代碼

@media screen and (max-width: 1200px) {

   .nb{width:1200px; overflow:hidden}

}

圖片鼠標上去旋轉360度的css3

a img{

    -webkit-transition: 0.4s;

    -webkit-transition: -webkit-transform 0.4s ease-out;

    transition: transform 0.4s ease-out;

    -moz-transition: -moz-transform 0.4s ease-out;

}

a:hover img{ 

transform: rotateY(360deg);

-webkit-transform: rotateY(360deg);

-moz-transform: rotateY(360deg);

}

鼠標放上去有陰影效果，位置偏移效果

li a:hover{

-moz-box-shadow:0px 0px 20px #2f566d; 

-webkit-box-shadow:0px 0px 20px #2f566d; 

box-shadow:0px 0px 20px #2f566d;

/*0 x y -5px translate 位置移動*/

transform: translate(0,-5px);

-webkit-transform: translate(0,-5px);

-moz-transform: translate(0,-5px);

-o-transform: translate(0,-5px);

-ms-transform: translate(0,-5px);    

}       

 css3漸變

 a{transition: all 0.3s ease 0s}

 css3透明效果

 opacity:0.8;filter:alpha(opacity=80); 

初始化css樣式

 body{

margin: 0 auto;

*margin:0px;

padding: 0px;

font-size: 12px;

line-height: 22px;

font-family:Microsoft YaHei,Helvitica,Verdana,Tohoma,Arial,san-serif;

background:#152b38;

 }

ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,img,div{margin:0px;padding:0px;border:0px;}

table,td{margin:0px;padding:0px;}

ul,li{padding:0px; margin:0px;}

ul,ol{list-style-type:none;}

li{ list-style-type:none; }

img{ border:none;}

a{ color:#000; text-decoration:none;}

a:hover{color:#bb0000; text-decoration:none;}

a.hong{ color:red; text-decoration:none;}

a.hong:hover{color:#C60;text-decoration:underline;}

.clear{clear:both;}

鄭州做網(wǎng)站，做網(wǎng)站優(yōu)化，歡迎選擇路普科技！