性色A∨一区二区三区无码,偷拍亚洲一区二区

用CSS寫一個(gè)背景動(dòng)態(tài)旋轉(zhuǎn)的效果

時(shí)間：2019-10-18 訪問量：0

有時(shí)候，我們在做網(wǎng)站的時(shí)候，需要一個(gè)動(dòng)態(tài)的旋轉(zhuǎn)圖片，但是又不想做成GIF格式，因?yàn)樘罅?。那么在網(wǎng)站建設(shè)中，還有什么方法來實(shí)現(xiàn)呢？

今天就來說一個(gè)，用CSS3的屬性來做一個(gè)圖片的旋轉(zhuǎn)。

手先，我們先寫一個(gè)DIV，并給他一個(gè)CSS樣式

<div class="xuanzhuan"></div>

然后，我們來寫style樣式

 <style>
    .xuanzhuan {
    width: 416px;
    height: 418px;
    background-size: 416px 418px;  //設(shè)置DIV的寬，高，背景的寬高 
    background: url(bg.png) no-repeat;  //這里是要旋轉(zhuǎn)的背景圖片  
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    animation: roate 15s infinite linear; //這是重點(diǎn)，給它一個(gè)旋轉(zhuǎn)的屬性
}

  @keyframes roate{
	0%{ transform:rotateZ(0);-ms-transform:rotateZ(0);-moz-transform:rotateZ(0);-webkit-transform:rotateZ(0);-o-transform:rotateZ(0); }
	100%{ transform:rotateZ(360deg);-ms-transform:rotateZ(360deg);-moz-transform:rotateZ(360deg);-webkit-transform:rotateZ(360deg);-o-transform:rotateZ(360deg);}
	}
	//定義旋轉(zhuǎn)效果
	
    </style>
    
	<div class="main_wai">
        </div>

醉后找一張需要的背景圖。放在一起，效果就實(shí)現(xiàn)了。

佐岸視覺，深圳專業(yè)的網(wǎng)站建設(shè)公司原創(chuàng)。

上一篇：我理解的css3中：position中的relative和absolute

下一篇：pbootcms后臺(tái)編輯器上傳視頻修改成自動(dòng)播放

服務(wù)咨詢

1對1咨詢，專業(yè)客服為您解疑答惑

聯(lián)系銷售

15899750475

在線咨詢

聯(lián)系在線客服，為您解答所有的疑問

ARE YOU INTERESTED IN ?

感興趣嗎？

有關(guān)我們服務(wù)的更多信息，請聯(lián)系項(xiàng)目經(jīng)理

15899750475 楊先生

亚洲青青视频一区|8MAV在线观看|天天看AV天天看|中日成人手机在线|欧美激情五区六区|亚洲婷婷天堂级片|亚洲天堂网7777|欧美日韩其他另类|手机在线成人AV|成人性大片一区二区三区四区五区

用CSS寫一個(gè)背景動(dòng)態(tài)旋轉(zhuǎn)的效果