介绍 & lt; div id=癰utterfly"比;
,,,& lt; div 类=發eftSide"祝辞& lt;/div>
,,,& lt; div 类=癰ody"祝辞& lt;/div>
,,,& lt; div 类=皉ightSide"祝辞& lt;/div>
& lt;/div> css 身体{
,,,,,,,,,,,背景:,url(“。/图片/bg.jpg"),不再重演;
,,,,,,,}
,,,,,,,{#蝴蝶
,,,,,,,,,,,宽度:,600 px;
,,,,,,,,,,,身高:,500 px;
,,,,,,,,,,,位置:,相对;
,,,,,,,,,,,变换:,规模(0.35);
,,,,,,,,,,,传输格式:,preserve-3d;
,,,,,,,}
,,,,,,,.leftSide {
,,,,,,,,,,,宽度:,267 px;
,,,,,,,,,,,身高:,421 px;
,,,,,,,,,,,背景:,url(“。/图片/leftSide.png"),不再重演;
,,,,,,,,,,,位置:,绝对;
,,,,,,,,,,,左:,26 px;
,,,,,,,,,,,:,40像素;
,,,,,,,,,,,动画:,left 2 s 无限;
,,,,,,,,,,,z - index:, 9999;
,,,,,,,}
,,,,,,,@keyframes left {
,,,,,,,,,,,{0%
,,,,,,,,,,,,,,,变换:,rotateY(0度);
,,,,,,,,,,,,,,,transform-origin:, right 中心;
,,,,,,,,,,,,,,,的观点:,201 px;
,,,,,,,,,,,}
,,,,,,,,,,,{50%
,,,,,,,,,,,,,,,变换:,rotateY(70度);
,,,,,,,,,,,,,,,transform-origin:, right 中心;
,,,,,,,,,,,,,,,的观点:,201 px;
,,,,,,,,,,,}
,,,,,,,,,,,{100%
,,,,,,,,,,,,,,,变换:,rotateY(0度);
,,,,,,,,,,,,,,,transform-origin:, right 中心;
,,,,,,,,,,,,,,,的观点:,201 px;
,,,,,,,,,,,}
,,,,,,,}
,,,,,,,@keyframes right {
,,,,,,,,,,,{0%
,,,,,,,,,,,,,,,变换:,rotateY (0);
,,,,,,,,,,,,,,,transform-origin:, left 中心;
,,,,,,,,,,,,,,,的观点:,201 px;
,,,,,,,,,,,}
,,,,,,,,,,,{50%
,,,,,,,,,,,,,,,变换:,rotateY(-70度);
,,,,,,,,,,,,,,,transform-origin:, left 中心;
,,,,,,,,,,,,,,,的观点:,201 px;
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
今天就跟大家聊聊有关使用css3怎么实现一个煽动翅膀的蝴蝶,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
html
