HTML 기울기

Posted by PeEn
2019. 10. 31. 11:41 Programing/Web Programming
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<style>
        p {
            width: 100px;
            height: 50px;
            border: 1px solid black;
            background: yellow;
            transition: width 5s, height 5s, border 5s, transform 5s;
}


        p:hover {
            width: 200px;
            height: 100px;
            border: 10px solid red;
            transform: perspective(300px) rotateY(59deg);
}

	</style>
</head>
	
<body>
    <p>마우스를 올려보세요.</p>

</body>
</html>

'Programing > Web Programming' 카테고리의 다른 글

HTML 공 튕기기  (0) 2019.10.31
HTML 좌우 움직임  (0) 2019.10.31
HTML 마우스 올리면 사이즈 조절  (0) 2019.10.31
HTML 투명도  (0) 2019.10.31
CSS 수평 리스트, 테이블  (0) 2019.10.22