随笔分类 -  CSS3&Animate

[转]SASS用法指南
摘要：[转]SASS用法指南 ========== 转自 "阮一峰 SASS用法指南" 一、什么是SASS SASS是一种CSS的开发工具，提供了许多便利的写法，大大节省了设计者的时间，使得CSS的开发，变得简单和可维护。 本文总结了SASS的主要用法。我的目标是，有了这篇文章，日常的一般使用就不需要去看 阅读全文
posted @ 2017-09-04 16:53 stephenykk 阅读(634) 评论(0) 推荐(0)
[转]前端利器：SASS基础与Compass入门
摘要：[转]前端利器：SASS基础与Compass入门 ================ SASS是Syntactically Awesome Stylesheete Sass的缩写，它是css的一个开发工具，提供了很多便利和简单的语法，让css看起来更像是一门语言，这种特性也被称为“css预编译”。它的 阅读全文
posted @ 2016-12-21 16:31 stephenykk 阅读(523) 评论(0) 推荐(0)
转:CSS3 Flexbox 布局介绍
摘要：转:CSS3 Flexbox 布局介绍 ====================== Flexbox是一个用于页面布局的全新CSS3模块功能。它可以把列表放在同一个方向（从左到右或从上到下排列），并且让这些列表能延伸到占用可用的空间。较为复杂的布局可以通过嵌套一个伸缩容器（flex containe 阅读全文
posted @ 2016-08-23 00:46 stephenykk 阅读(242) 评论(0) 推荐(0)
Less基础教程
摘要：Less基础教程 ====================== 是较早出现的css预处理器。 "LESS API 参考" 安装和使用 安装比较简单,通过nmp或bower安装即可. npm install less g bower install less 新版的chrome能直接解析less样式， 阅读全文
posted @ 2016-06-21 10:35 stephenykk 阅读(845) 评论(0) 推荐(0)
css3_note
摘要：css3基础 ======================== css3选择器 1. 属性选择器 属性选择器基本上IE7+都支持，可以放心的使用，参见 "caniuse" + [attr] + [attr=val] + [attr =val] + [attr^=val] + [attr$=val] 阅读全文
posted @ 2016-01-30 18:38 stephenykk 阅读(283) 评论(0) 推荐(0)
bootstrap读书笔记
摘要：1. 引入bootstrap.js或单个插件的js文件 若引入单个插件的js文件，注意插件之间的依赖关系 2. data属性api data属性的api很方便，但我们也可以选择关闭这个功能：$(document).off('.data api'); $(document).off('.alert.d 阅读全文
posted @ 2014-11-27 11:02 stephenykk 阅读(673) 评论(0) 推荐(0)
转: css3动画简介以及动画库animate.css的使用
摘要：~~~ transition animation 和 animate.css 在这个年代，你要是不懂一点点css3的知识，你都不好意思说你是个美工。美你妹啊，请叫我前端工程师好不好。呃。。好吧，攻城尸。。。呵呵，作为一个攻城尸，没有点高端大气上档次的东西怎么能行呢，那么css3的动画就绝对是值得你拥 阅读全文
posted @ 2014-06-20 09:20 stephenykk 阅读(387) 评论(0) 推荐(0)
bootstrap基础知识
摘要：Bootstrap是Twitter推出的一款简洁、直观、强悍的前端开发框架。 Bootstrap基于 HTML、CSS、JAVASCRIPT。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。 ~~~引入bootstrap的css和页面自 阅读全文
posted @ 2014-06-05 09:44 stephenykk 阅读(2053) 评论(0) 推荐(0)
转: 用css把图片转为灰色图
摘要：小tip: 使用CSS将图片转换成黑白(灰色、置灰) by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=2547 //zxx: 最近很积极地折腾手机页面的些东西，加上其他一些 阅读全文
posted @ 2014-05-06 13:57 stephenykk 阅读(4088) 评论(0) 推荐(1)
Raphael入门实例：动画与箭头
摘要：raphael 实例 动画 隐藏和显示参数说明 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 var c = paper.circle(50, 50, 40); function hide() { c.hide(); setTimeout(show, 1000); } functi 阅读全文
posted @ 2014-02-24 07:08 stephenykk 阅读(2281) 评论(0) 推荐(0)
Raphael入门实例：绘图
摘要：raphael 实例 开始 创建画布参数说明 创建一个画布对象。 下面每个例子都会创建一个320*200大小的画布。 ? 1 2 // 1.在视口的 (10,50) 坐标位置上创建画布 var paper = Raphael(10, 50, 320, 200); ? 1 2 // 2.在#eleme 阅读全文
posted @ 2014-02-24 06:01 stephenykk 阅读(782) 评论(0) 推荐(0)
Raphael Js矢量库API简介：
摘要：Raphael Js矢量库API简介：Raphael Javascript 是一个 Javascript的矢量库。 2010年6月15日，著名的JavaScript库ExtJS与触摸屏代码库项目jQTouch，以及SVG、VML处理库Raphael合并，形成新的库Sencha。主要应对HTML5等新 阅读全文
posted @ 2014-02-18 09:38 stephenykk 阅读(13360) 评论(0) 推荐(0)
GSAP学习笔记
摘要：GSAP（Green Sock Animation Platform）是一个十分好用的js动画库，据说是as的精简版 以下是学习GSAP的一些笔记：貌似中文的文档不是很多 GSAP notes: tl.to(obj,2,{x:100,y:100}); //添加动画片段到时间轴tl.to([obj1, 阅读全文
posted @ 2014-01-01 15:43 stephenykk 阅读(940) 评论(0) 推荐(0)