CSS3教程
css3 transfrom:translate元素居中
CSS3的transform: translate()函数可以使元素居中排版，下面是transform: translate()函数的例子：.container { display: flex; justify-content: center; /* 水平居中 */ align-items: center; /* 垂直居中 */ height: 100vh; /* 使容器的高度为视...
CSS3不倒翁动态效果代码
HTML代码<div class="santa"><div class="santa-body"><div class="santa-head"><div class="santa-ear"></div><div class="santa-ear"></div><div class="santa-hat&qu...
CSS3旋转动画效果分享
定义 dom，容器中包含 9 个元素：<div class="container"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span&...
CSS3实现苹果灵动岛效果
主要利用了CSS3-animation + JS实现效果，只是提供思路，具体细节可以参考<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title>灵动岛</title>...
CSS3旋转/放大/移动动画效果代码
效果一：360°旋转 修改rotate(旋转度数).img1 {transition: All 0.4s ease-in-out;-webkit-transition: All 0.4s ease-in-out;-moz-transition: All 0.4s ease-in-out;-o-transition: All 0.4s ease-in-out;}.img1:hover {transform: rotate(360deg)...