css
文章平均质量分 82
出于蓝
这个作者很懒,什么都没留下…
展开
-
用css的变换绘制银河系
html部分:<section class="galaxy"> <ul class="orbit"> <li class="mercury"><span> <span class="mer"></span></span&原创 2018-04-01 20:58:20 · 1054 阅读 · 0 评论 -
用css做一个旋转的球
我们都知道,球无论怎么旋转,无论从哪个角度看过去都是圈形所以,只要我们将球表面的图案围绕着球心转动,看起来就是球在转动point 是将里面的元素进行3D旋转,使之有一个躺下的效果face face2 是两只眼睛围绕的中心html部分:<div class="bg"> </div> <div class="point"> ...原创 2018-04-01 21:10:57 · 3168 阅读 · 0 评论 -
用css和javascript做简单的破壳动画
今天是我的生日,就想用自己学的一点点小知识写一个破壳动画,开心一下 首先,先画一个蛋 然后动态的在蛋的上面画裂痕,这里画了一条波浪线来替代 接着蛋蛋左右摇晃几下 然后就破壳了整个动画不是特别流畅,但是知识有限,只能做得比较粗糙一些html部分: <div class="ege" id="shake"> <div class="...原创 2018-04-03 00:23:55 · 248 阅读 · 0 评论 -
用css做一个旋转的地球仪
html部分:<body> <div class="hoder"></div> <div class="circle"></div> <div class="circle equator"></div> <di原创 2018-03-29 12:11:02 · 2762 阅读 · 1 评论 -
用svg来给图标绘边
首先先介绍一下 stroke-dasharray和stroke-dashoffset这两个属性1 stroke-dasharray这个属性就是给图标绘边.当 stroke-dasharray只有一个参数时,描绘的是需要,线段的长度,间隔的距离等于 stroke-dasharray的值当 stroke-dasharray有两个参数时,第一个表示线段的长度,第二个表示距离多个参数时,第奇数个参数表示线...原创 2018-04-04 23:59:41 · 285 阅读 · 0 评论 -
前端里的几种颜色渐变
1 canvas画布里的渐变: 要创建一个新的线性渐变,可以调用createLinearGradient()方法。这个方法接收4 个参数:起点的x 坐标、起点的y 坐标、终点的x 坐标、终点的y 坐标。调用这个方法后,它就会创建一个指定大小的渐变,并返回CanvasGradient 对象的实例。 创建了渐变对象后,下一步就是使用addColorStop()方法来指定色标。这个方法接收两...原创 2018-04-14 23:31:05 · 8230 阅读 · 0 评论 -
用css3径向渐变制作花纹背景
我们可以通过多种css3渐变的叠加制作各种各样好看的花纹css3中.如果有多种渐变叠加,先写的渐变会覆盖后写的渐变.制作格子花纹:代码如下: .bg{ width: 120px; height: 200px; background-color: #282828; background-image: ...原创 2018-04-22 21:17:18 · 1848 阅读 · 0 评论