介绍 & lt; p类=癱ode-bg"在
& lt; p类=發ine"祝辞& lt;/p>
& lt;/p>
。code-bg {
:相对;
身高:200 px;宽度:200 px;
保证金:0 px汽车;/*此处为了居中*/
背景:url (img/ewm1.jpg)中心前不再重演;/*二维码*/
}
.line {
:绝对;左
: -80 px;
z - index: 2;
高度:3 px;宽度:360 px;
背景:url (img/分享/dapai.png)不再重演;/*上下扫的线*/
/*动画效果*/
动画:myScan 1 s无限备用;
-webkit-animation: myScan 1 s无限备用;
}
@keyframes myScan从{{
: 0 px;{}
: 197 px;}
}
webkit -@keyframes myScan从{{
: 0 px;{}
: 197 px;}
}
这篇文章将为大家详细讲解有关CSS实现二维码扫描效果的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
扫描二维码的效果,我原以为不好写呢,后来想了想其实挺简单的,几行代码,走起
& lt; p类=發ine"祝辞& lt;/p>
& lt;/p>
:相对;
身高:200 px;宽度:200 px;
保证金:0 px汽车;/*此处为了居中*/
背景:url (img/ewm1.jpg)中心前不再重演;/*二维码*/
}
.line {
:绝对;左
: -80 px;
z - index: 2;
高度:3 px;宽度:360 px;
背景:url (img/分享/dapai.png)不再重演;/*上下扫的线*/
/*动画效果*/
动画:myScan 1 s无限备用;
-webkit-animation: myScan 1 s无限备用;
}
@keyframes myScan从{{
: 0 px;{}
: 197 px;}
}
webkit -@keyframes myScan从{{
: 0 px;{}
: 197 px;}
}
我这里不方便截的图,那就这样吧,是不是很简单。
关于CSS实现二维码扫描效果的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看的到。
