2020-07-07
77
CSS3教程
3 transfrom:translate元素居中
CSS3的transform: translate()函数可以使元素居中排版，下面是transform: translate()函数的例子：在这个例子中，.container是一个flex容器，它使其子元素.item在水平和垂直方向上居中。
3不倒翁动态效果代码
CSS3不倒翁动态效果代码是一种使用HTML和CSS实现的动画效果，可以创建出类似不倒翁在地面上滚动的效果。该代码通过改变不倒翁的位置和方向，使其看起来好像在地面上滚动一样。...
3旋转动画效果分享
定义 dom，容器中包含 9 个元素：居中显示：定义容器尺寸：设置容器中线条的样式：让线条在容器中居中显示：定义变量，使线条从中心向外侧逐渐延伸：设置让线条旋转的动画效果：定义改变颜色的动画效果，以色相环一周 360 度为 100%，--percent 变量是指位于这个 100% 的...
3实现苹果灵动岛效果
主要利用了CSS3-animation + JS实现效果，只是提供思路，具体细节可以参考。
3旋转/放大/移动动画效果代码
效果一：360°旋转 修改rotate(旋转度数)效果二：放大 修改scale(放大的值)效果三：旋转放大 修改rotate(旋转度数) scale(放大值)效果四：上下左右移动 修改translate(x轴,y轴)。
3海浪波浪动态效果代码
建立一个div，id为wavesDIV，之后使用svg绘制一个图形出来，此时这个图形还是不会懂的，我们需要使用animation来让他动起来使用@keyframes设定动画，使用animation调用当然如果在中间加多点，譬如说10%,20%,30%,40%,50%,60%，动态会更强烈。...
3修改浏览器滚动条样式
首先我们写一个简单的小实例来说明下，设置一个长框为300的div，设置下溢出滚动。CSS滚动条语法同时他还有不同的状态，比如选择，鼠标放上去的时候：horizo​​ntal - 水平伪类适用于任何具有水平方向的滚动条。...
CSS3+JS页面loading过度跳转效果
CSS3+JS页面loading过度跳转效果，字母跳动效果，具体效果如下图修改跳转链接只需要改这个地方的链接就可以了换成你的跳转网址，3代表3秒后跳转，也可以随意调整。...
3背景渐变语法
background：背景linear-gradient：渐变0deg：渐变方向，比如从左到右，从右到左，从上到下等等#fff：渐变起始颜色#000：渐变结束颜色0%，100%：透明度。
3高光划过效果代码教程
我们常常看到的高光划过效果，其实用CSS就能实现，CSS3高光划过效果代码教程方法CSS3高光划过效果代码.logo-wrapper为需要增加效果的盒子，.logo-wrapper::before为添加的一道高光，@-webkit-keyframes searchLights高光动画效果代码。...