CSS3的@keyframes用法详解: 此属性与animation属性是密切相关的,关于animation属性可以参阅CSS3的animation属性用法详解一章节。 一.基本知识: keyframes翻译成中文,是"关键帧"的意思,如果用过flash应该对这个比较好理解,当然不会flash也没有 ...
分类:
数据库 时间:
2019-04-13 11:00:42
阅读次数:
167
1、 ,鼠标移开后图片面向屏幕后又自动可见了。 2、css3动画 !!定义好动画后再引用 4、多组动画(百分比) 案例: 案例2 无缝滚动 ...
分类:
Web程序 时间:
2019-04-13 00:40:04
阅读次数:
217
//通过ClassName获取div,使用setAttribute设置div禁止点击 pointer-events: none;是css3新出现的属性,意思就是禁止鼠标点击事件,当元素中有这一属性时,链接、点击事件统统失效 ...
分类:
Web程序 时间:
2019-04-12 16:25:15
阅读次数:
530
1、css3过渡 注意:记住多属性设置的方式;若把过渡写在了hover里面的话鼠标移走时不会有过渡效果!;不同属性同时变时用 all 就可以实现了。 2、css3 transform属性 1、移动 translate 2、旋转 rotate 不同旋转点旋转案例 3、css3--3D变形 rotate ...
分类:
Web程序 时间:
2019-04-12 01:03:35
阅读次数:
212
最近在学习html+css3基础教程,整理了一些基础知识点。在此与大家分享。 1.盒模型 定义:css处理网页时,它认为每个元素都包含在一个不可见的盒子里,即我们所熟知的盒模型。其中它的主要属性有:height.weight,padding,border,margin。 height,weight: ...
分类:
Web程序 时间:
2019-04-11 23:28:57
阅读次数:
297
一款非常常用的css 加载动画,这款CSS3 Loading动画主要由几个小球通过规律的上下跳动,渐隐渐显而成,效果十分生动、流畅。兼容IE8以上,尤其适合在移动端中使用,基本代替了图片实现加载的效果。 HTML CSS demo显示 说明 注意:1rem通常是16px。 @keyframes定义具 ...
分类:
其他好文 时间:
2019-04-11 23:21:32
阅读次数:
224
在检查网站的时候发现图片给于固定宽的时候,会压缩变形,要保证,img元素不变形,宽高比不变。从别人那里了解到object-fit,以前从未用过,所以就总结给自己看看,理解一下。 object-fit css属性指定可替换元素的内容应该如何适应到其使用高度和宽度确定的框内。 object-fit 的语 ...
分类:
Web程序 时间:
2019-04-09 18:33:25
阅读次数:
198
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>底部菜单上拉效果</title> <style> *{ margin: 0; } .wrap{ width: 1200px; margin: 50px auto; } .wrap . ...
分类:
Web程序 时间:
2019-04-06 19:16:39
阅读次数:
757
我们平时都称之为 Sass,其实可分成sass和scss, 其中Sass 是以严格的缩进式语法规则来书写,不带大括号({})和分号(;),以“.sass”后缀为扩展名;而 SCSS 是 Sass 3 引入新的语法,其语法完全兼容 CSS3,并且继承了 Sass 的语法书写和我们的 CSS 语法书写方 ...
分类:
Web程序 时间:
2019-04-06 18:53:29
阅读次数:
401
课程地址:http://www.imooc.com/learn/33 第1章 初识CSS3 CSS3课程列出第一站,先带领大家进入CSS3的世界,探索CSS3的魅力!你做好准备了吗? 第2章 边框 本课程主要解说border-color 、border-image 、border-radius 及b ...
分类:
Web程序 时间:
2019-04-05 09:29:57
阅读次数:
218