HTML如何做翻动？
网友解答: 要做到翻动，这是我编了一个模拟书籍翻页的效果。运用到CSS3 @keyframes 关键字，在创建动画时，把它连到一个选择器，并用百分比产生时间轴，然后就会看到动画效果翻页效
要做到翻动，这是我编了一个模拟书籍翻页的效果。运用到CSS3 @keyframes 关键字，在创建动画时，把它连到一个选择器，并用百分比产生时间轴，然后就会看到动画效果翻页效果。如下是部分源码，请关注我，并与你分享，谢谢！<!DOCTYPE html
<html
<head
<style
body
{
perspective: 1000px;
background-color: #212121;
}
.box
{
position: absolute;
top: 50%;
left: 50%;
……
}
.box1 {
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 300px;
border: 1px solid #1976D2;
transform-origin: 0 50%;
background:Beige;
animation: mybox 5s;
}
……
@keyframes mybox
{
0% {transform: rotateY(0deg);}
50% {transform: rotateY(-150deg);}
100%{transform: rotateY(0deg);}
}
</style
</head
<body
<div class="box"
<p 第<br二<br页</p
……
<p
首<br页
</p
</div
</div
……
下面在手机AIDE Web应用中运行结果