HTML<會飛的小火箭>

05-26

HTML<會飛的小火箭>

來自專欄 PHP全棧開發

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width_=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>會飛的小火箭</title><style>*{ margin: 0; padding: 0;}html,body{ width:100%; height:100%;}body{ background-image: radial-gradient(200px at right top, red, yellow, skyblue ); overflow: hidden;}img{ position: absolute; top:100%; left:0;}body:hover img{ transform: translate(1300px,-800px)scale(0) rotate(45deg); transition: all 5s;}</style></head><body> <img src="images/1.jpg" alt=""></body></html>