摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Docum 阅读全文
posted @ 2022-05-15 16:51
hi123hi159
阅读(75)
评论(0)
推荐(0)
摘要：
.box { /* 1680/12 */ width: 140px; height: 140px; /* border: 1px solid #000; */ background-image: url(./images/bg.png); animation: move 1s steps(12) i 阅读全文
posted @ 2022-05-15 15:23
hi123hi159
阅读(45)
评论(0)
推荐(0)
摘要：
/*分步动画,重复3次播放*/ animation: change 1s steps(3) 1s 3; /*无限循环*/ animation: change 1s infinite alternate; /*执行完毕状态*/ animation: change 5s forwards; 阅读全文
posted @ 2022-05-15 14:55
hi123hi159
阅读(54)
评论(0)
推荐(0)
摘要：
.box { width: 200px; height: 100px; background-color: pink; /*使用动画*/ animation: change 5s; } /* 一. 定义动画：从200变大到600 */ /* @keyframes change{ from{ widt 阅读全文
posted @ 2022-05-15 14:27
hi123hi159
阅读(21)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>3D导航</tit 阅读全文
posted @ 2022-05-15 13:39
hi123hi159
阅读(58)
评论(0)
推荐(0)
摘要：
/*半透明渐变*/ background-image: linear-gradient( transparent, rgba(0,0,0,.6) ); 阅读全文
posted @ 2022-05-15 11:35
hi123hi159
阅读(25)
评论(0)
推荐(0)
摘要：
/*取值大于1（放大），取值小于1（缩小）*/ transform:scale(x轴缩放倍数,y轴缩放倍数) 阅读全文
posted @ 2022-05-15 10:39
hi123hi159
阅读(32)
评论(0)
推荐(0)
摘要：
/* 边走边转 */ transform: translate(600px) rotate(360deg); 阅读全文
posted @ 2022-05-15 10:21
hi123hi159
阅读(35)
评论(0)
推荐(0)
摘要：
transform-origin: right bottom; transform-origin: left bottom; 阅读全文
posted @ 2022-05-15 10:12
hi123hi159
阅读(51)
评论(0)
推荐(0)
摘要：
img { width: 250px; transition: all 2s; } img:hover { transform: rotate(360deg); } 阅读全文
posted @ 2022-05-15 10:00
hi123hi159
阅读(76)
评论(0)
推荐(0)
浙公网安备 33010602011771号