                        課程
                    
                        /前端開發(fā)
                        
                            /HTML/CSS
                        
                        /CSS動(dòng)畫實(shí)用技巧

關(guān)于評(píng)論的測(cè)試代碼

<!DOCTYPE?html>
<html>
<head>
	<title></title>
	<meta?charset="utf-8">

	<style?type="text/css">
		*{
			margin:?0;
			padding:?0;
		}
		.warp,.info{
			width:300px;
			height:?300px;
			border-radius:?50%;
		}
		.warp{
			
			border:10px?solid?;
			border-radius:?50%;
			border-top-color:?yellow;
			border-left-color:?gray;
			border-right-color:?yellow;
			border-bottom-color:?gray;
			transform-origin:?50%?50%;
			transition:?all?.5s?ease-in-out;
		}		
		.info{
			background-image:?url(1.jpeg);			
			color:red;
			text-align:?center;	
			position:?absolute;
			transition:all?.5s?ease-in-out;
		}

		h3{
			margin-top:120px;
		}
		.warp:hover{
			transform:?rotate(180deg);
			
		}
		.info:hover{
			transform:?rotate(-180deg);			
		}
	</style>
</head>
<body>
<div?class="warp">	
	<div?class="info">
		<h3>美好的一天</h3>
		<a>想進(jìn)來(lái)看看嗎？</a>
	</div>	
</div>	
</body>
</html>