Transition with Color HTML5

<!DOCTYP html>

<html>

<head>

<style type=""text/css">

div

{

width: 150px;

height: 200px;

background-color: Yellow;

-webkit-transition: width 8s,

-webkit-transform 8s;

}

div:hover

{

-webkit-transform: rotate(30deg);

width: 300px;

background-color: red;

}

</style>

</head>

<body>

<div>Test border</div>

</body>

<html>

------------------------------------------------

เมื่อคลิกที่รูปสีเหลืองรูปจะเปลี่ยนสีเป็นสีแดง รูปค่อย ๆ เอียง พร้อมกับขยายขนาดเป็นดังรูป

yel
rd