今天和大家分享一个利用CSS3的animation属性完成的一个边框动画效果。大家都知道，CSS3给我们提供了@keyframes关键字，能让我们在网页中轻松插入动画。一个简单的动画插入，结构如下： 效果如下： 除了用from to 这种形式之外，我们还可以用百分比，更加细化各个阶段的表现样式，例子 ...
分类：
Web程序 时间：
2019-01-31 13:00:14
阅读次数：
337
css3里面有一个@keyframes动画功能。 w3c上面的例子： 可以使用它来做一个幻灯片效果。 ...
分类：
Web程序 时间：
2019-01-31 01:32:32
阅读次数：
215
1、 背景颜色 background-color:后面跟颜色属性 2、 背景图片 background-image 属性允许指定一个图片展示在背景中（只有CSS3才可以多背景）可以和 background-color 连用。 如果图片不重复的话，图片覆盖不到地地方都会被背景色填充。 如果有背景图片平... ...
分类：
Web程序 时间：
2019-01-30 07:20:40
阅读次数：
223
来源：https://www.imooc.com/code/691 设置背景图片的大小，以长度值或百分比显示，还可以通过cover和contain来对图片进行伸缩。 语法： background-size: auto | <长度值> | <百分比> | cover | contain 取值说明： 1 ...
分类：
Web程序 时间：
2019-01-30 01:31:17
阅读次数：
222
来源：https://www.imooc.com/code/657 设置元素背景图片的原始起始位置。 语法： 参数分别表示背景图片是从边框，还是内边距（默认值），或者是内容区域开始显示。 效果如下： 需要注意的是，如果背景不是no-repeat，这个属性无效，它会从边框开始显示。 ...
分类：
Web程序 时间：
2019-01-30 01:24:17
阅读次数：
191
RGBA是在RGB的基础上增加了控制alpha透明度的参数。 以上R、G、B三个参数，正整数值的取值范围为：0 - 255。百分数值的取值范围为：0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A为透明度参数，取值在0~1之间，不可为负值。 渐 ...
分类：
Web程序 时间：
2019-01-30 00:20:48
阅读次数：
452
开始我们需要先了解什么是calc() ，calc()是一个CSS函数，你可以使用calc()给元素的margin、pading、width等属性设置 而且你还可以在一个calc()内部嵌套另一个calc() clac()的语法就非常简单了 ， 使用数学表达式来表示： expression 一个数学表 ...
分类：
Web程序 时间：
2019-01-29 20:43:07
阅读次数：
190
在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分，是浏览器的私有属性，虽然目前较新版本的浏览器都是不需要前缀的，但为了更好的向前兼容前缀还是少不了的。 前缀 浏览器 -webkit- chrome、safari -moz- firefox -m ...
分类：
Web程序 时间：
2019-01-29 20:38:46
阅读次数：
294
border-radius是向元素添加圆角边框。 使用方法：1. border-radius:10px; /* 所有角都使用半径为10px的圆角 */ 2. border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角、右上角、右下角和左下角，顺时针 */ 利用bor ...
分类：
Web程序 时间：
2019-01-29 20:28:09
阅读次数：
513
