1、@keyframes 定义关键帧动画2、animation-name 动画名称3、animation-duration 动画时间4、animation-timing-function 动画曲线 linear 匀速 ease 开始和结束慢速 ease-in 开始是慢速 ease-out 结束时慢速 ...
分类：
Web程序 时间：
2020-02-23 18:43:09
阅读次数：
75
1、transition-property 设置过渡的属性，比如：width height background-color2、transition-duration 设置过渡的时间，比如：1s 500ms3、transition-timing-function 设置过渡的运动方式 linear 匀 ...
分类：
Web程序 时间：
2020-02-23 18:23:51
阅读次数：
86
浏览器样式前缀 为了让CSS3样式兼容，需要将某些样式加上浏览器前缀： -ms- 兼容IE浏览器-moz- 兼容firefox-o- 兼容opera-webkit- 兼容chrome 和 safari 比如： div { -ms-transform: rotate(30deg); -webkit-t ...
分类：
Web程序 时间：
2020-02-23 18:19:31
阅读次数：
70
目录： 1、属性选择器 p[style]{ 有style属性的p标签 color:red; } p[class=red]{ class的值为red的p标签 background-color: blue; } p[class='red']{ class的值为red的p标签 background-col ...
分类：
Web程序 时间：
2020-02-23 18:13:57
阅读次数：
89
什么是CSS position定位？ 定位定位，顾名思义就是用CSS样式来给我们特定的元素进行定位，使得我们所设定的元素具有坐标，让我们方便的给它在网页中设定位置以及更好的挪动他。就比如在网页中的一些广告，无论你怎么滑动网页都无法隐藏掉广告，这就运用到我们强大的CSS定位。CSS定位的内容包括：po ...
分类：
Web程序 时间：
2020-02-23 18:04:13
阅读次数：
76
CSS3 transform变换 1、translate(x,y) 设置盒子位移2、scale(x,y) 设置盒子缩放3、rotate(deg) 设置盒子旋转4、skew(x-angle,y-angle) 设置盒子斜切5、perspective 设置透视距离6、transform-style fla ...
分类：
Web程序 时间：
2020-02-23 17:53:48
阅读次数：
73
在CSS3中盒模型分为两种： 一种就是我们所熟知的标准盒模型 而另一种就是所谓的怪异盒模型或者IE盒模型 由上图我们可以知道 在标准盒模型中width和height指的是盒子内容的宽高，而在怪异盒模型中wdith还包含了border和margin区域 通过在文档首部添加doctype申明，即表明使用 ...
分类：
其他好文 时间：
2020-02-23 16:33:35
阅读次数：
96
showhide.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>showhide</title> <link rel="stylesheet" href="../css/base.css"> <s ...
分类：
Web程序 时间：
2020-02-22 16:06:50
阅读次数：
77
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< ...
分类：
Web程序 时间：
2020-02-22 12:14:48
阅读次数：
101
通过CSS中的animation属性来实现摩天轮旋转的动态效果。在开始之前，先说下animation属性，原理是逐帧动画，通过关键帧控制动画的每一步，来实现最终的动态效果。 而常用到的几个属性分别是： 1.animation-name，设置元素动画的名字，自定义即可 2.animation-dura ...
分类：
Web程序 时间：
2020-02-21 22:14:52
阅读次数：
165
