摘要：
1、相同 less和sass在很多思想上是相同的，也都是通过转化css的方式通过浏览器来运行。 2、less缺点 = sass优点 通过对写less系列文章后的个人感受来讲，less的确也称不上是一种变成语言，虽然相比css要进步不少，多了变量、函数，包括判断、运算等处理逻辑，但这些仍然是在利用cs 阅读全文
摘要：
extend是less的一个伪类，所以要这么用 &:extend() {}。 一看单词就知道，这其实就是继承嘛，你没看错，这就是继承。 问题来了，less既然有mixin，为啥还需要extend呢？有人看到这话可能不太理解，那我就用例子解释一下 用法：官网上给了很多例子，总结起来就一句话，继承指定类 阅读全文
摘要：
说到&符号，前几章的介绍中都已经遇到过了，比如说.box-part1&:before{}。 先说说伪类，由于伪类在css中使用“:”（冒号）来引用的，而“:”（冒号）在less是用来属性和变量赋值的特殊符号，所以less给出了一个新的策略“&”符号。 而伪类在css中是附属在某个实际存在的模块上的类 阅读全文
摘要：
不同于css中的import，less可以在文件中的任何一个地方引入，包括选择器中或者函数中。 并且less还对import提供了不同的参数：reference、inline、less、css、multiple、once，如果不指定参数默认是once，下面对各个参数进行了解释 @import (re 阅读全文
摘要：
关于函数的参数，官方给出了多种策略，这叫人看上去有点面向对象的感觉（函数是特殊的mixin，所以下面的很多特性mixin都通用） 1、参数的表现形式，“,”和“;”（逗号和分号） 比如说一个函数.aaa(@par1,@par2)里面有两个参数，参数之间用“,”间隔，但在less中“,”的含义是“或” 阅读全文
摘要：
讲函数之前先说说我对“混合”的理解，“混合”官网称作mixin，理解为可以把一个集合体嵌入到另一个集合体中、也可以把两个集合体捏合成一个集合体，而这个集合体就称作mixin。 举个例子：.cls { background:#000000;} 这是最常见class选择器的样式，但在less认为，这就是 阅读全文
摘要：
官网的api中，判断和循环是page的后面才被说明的，可能官方认为它们两个也属于“混合”。 但为了更好的学习less，我把它拿到了这章先来了解一下。 注：例子截图是转换成css的语句 1、判断：官网称作Mixin Guards （1）语法规则：when ( 布尔值 ) { 内容 } //用法一:wh 阅读全文
摘要：
详细介绍：http://lesscss.cn/usage/ 语法：定义和引用都使用@的前缀 切入正题直接例举用法（截图是解析后的结果） //用法一：一般变量赋值@w:50px;@h:50; @p:height;.box1 { width:@w - 10; //运算符和变量间一定要留空格 @p:@h; 阅读全文
摘要：
先来简单的介绍一下： 预处理css也算是相对比较新的技术，它给css添加了变量、函数、逻辑运算等语法，让css看起来更像是一种变成语言了。当然了，外表是次要的，功能才是主要，预处理css在样式的编写上变得更加容易，更加简单，甚至更加方便，可能原本一篇几千行的css文件最多几百行就可以搞定。 在百度这 阅读全文
摘要：
针对于HTML5新增的canvas元素，本人觉得挺好用的，想针对于这个单独做一个介绍和使用说明 下面先给个canvas的例子： 当实例化canvas后便可对canvas进行操作 首先我们要获取一个canvas的画板 注：我试过通过new来实例化好像会报错，具体我再查查资料，我会陆续更新这个文章 我们 阅读全文
摘要：
话提前先简单介绍一下phaser，这是一款HTML5的游戏开发框架，下面的介绍也是基于这个框架进行写的 下面这个是游戏的演示，控制白色的方块移动，并躲避黑色的方块，靠吃掉黄色的方块得分 代码1：先搭出来游戏框架 说明：暂时先构建了两个状态函数：Load和Play Load：用于加载资源，很多游戏中的 阅读全文
摘要：
文章发布完两个例子后，继续更新文章 transition（过渡），原理和animation相似，但也有一些不同，我下面列举一下。 1、逆向动画： animation 需要定义animation-direction:normal，但只能正向结束后再逆向 transition 只要一结束触发就会自动逆向 阅读全文
摘要：
在之前聊到transform的时候，就看到里面有一些3D函数，但是基于3D的特殊性，我会在下面单独介绍3D的用法和特性 这是在网上找的一个图，先初步认识一下3D的坐标系 x轴、y轴大家都知道： x轴坐标值向右增加、向左减少； y轴坐标值向下增加、向上减少； z轴在2D平面上是看不到的，但如果把2D平 阅读全文
摘要：
css3手工绘制旋转菜单下面是css代码： .box { text-align: center; width: 1000px; height: 600px; border: 1px solid black;}.border { visibility: hidden; /* position:关于ab 阅读全文
摘要：
纯css3手工绘制动画形式的统计条形图demo，代码我已经做成动态的了，如下： <html> <head> <title>example</title> <style>/*外层模型*/.example .border { margin:30px auto; padding-left:30px; pa 阅读全文
摘要：
首先介绍一下transform是干什么的，下面这段话节选自W3CSchool： transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。 而transform只是单纯的图形操作，所以要和animation属性连起来用才能设计出各种各样的动画效果。 语 阅读全文
摘要：
用程序做过动画的同学再看下面的这篇讲解，或许会非常熟悉（不同程序写动画语法可能稍微不太一样，但很多的思想和原理都是相同的）。 1、再介绍css3动画前，先普及一下一些动画相关的概念： 帧(frame)：通过去的胶片电影一样，几十张图连起来放就是动画，一张图就是一帧，人眼识别的极限大概是24帧/秒（看 阅读全文
摘要：
说实话，早先我以为$在js中是有特殊含义的符号，便在网上到处去搜它的意义和用法，可始终无果。 我在本地也尝试着用$符号组合一些变量，甚至单独用它当做一个变量都可以使用，故我就猜测js并没有赋予$符号含义，同"_"等符号是一样的可以当做变量或变量的一部分使用。 不过，正是这个没有用的符号却创造出了各种 阅读全文
摘要：
js中有两个隐含的属性prototype、__proto__。（prototype通过创建的function来访问，__proto__是任何对象都可以访问的属性） 通过下面几个例子来详细分析一下这两个属性的区别： 例子1： 能看出来只有原型，即构建function的变量a1才有prototype属性 阅读全文