07 2016 档案
摘要:sass语法 关于sass 3.3.0更新说明——3.3.0 sublime相关插件为:scss语法高亮,sass语法高亮,编译,保存即编译,格式化 文件后缀名 sass有两种后缀名文件:一种后缀名为sass,不使用大括号和分号;另一种就是我们这里使用的scss文件,这种和我们平时写的css文件格式
阅读全文
摘要:一些编码标准: 网易NEC : 更好的CSS样式解决方案 特效CSS: Hover.css http://ianlunn.github.io/Hover/
阅读全文
摘要:gulp 一个入门教程:http://www.ydcss.com/gulp API文档地址:http://www.gulpjs.com.cn/docs/api/我的一个Low版的gulpfile var gulp = require('gulp'); gulpif = require('gulp-i
阅读全文
摘要:需要node、npm的事先安装!! 1、nodejs安装程序会在环境变量中添加两个变量: 系统环境变量中:path 增加C:\Program Files\nodejs\ 因为在该目下存在node.exe 和npm.cmd,加入path后可以全局调用该命令。 用户变量中设置: path=C:\User
阅读全文
摘要:一、RequireJS的主要作用与优点 主要作用:js模块化、编写复用js代码 优点: 1、防止命名冲突 2、声明不同js文件之间的依赖 3、代码模块化 (1)一个文件一个模块:每个js文件应该只定义一个模块 (2)define()中注意相对模块名 二、常用方法 1、require.config 为
阅读全文
摘要:var b_name = navigator.appName;var b_version = navigator.appVersion;var version = b_version.split(";");var trim_version = version[1].replace(/[ ]/g, "
阅读全文
摘要:(一)窗体 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主
阅读全文
摘要:前端交流站点 大前端 http://www.daqianduan.com/ V2EX http://www.v2ex.com/ W3cplus http://www.w3cplus.com/ W3Cfuns http://www.w3cfuns.com/ Github https://github.
阅读全文
摘要:在桌面端和移动端用CSS开启硬件加速 CSS animations, transforms 以及 transitions 不会自动开启GPU加速,而是由浏览器的缓慢的软件渲染引擎来执行。那我们怎样才可以切换到GPU模式呢,很多浏览器提供了某些触发的CSS规则。 现在,像Chrome, FireFox
阅读全文
摘要:译者:jmouse 大多数基于触摸的浏览器设备,在点击时都会有个 300ms 的事件触发等待时间,做过 web app 开发的同学应该都遇到过这个情况,通过下面的5步可以轻松搞定这个延迟。 1、不要太纠结于此 是否能接受这 300ms 的时间延迟,往往取决于你的应用和目标受众,比如:如果是个内容为主
阅读全文
摘要:BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等)。虽然我知道如何利用 BFC 解决这些问题,但当别人问我 BFC 是什么,我还是不能很有底气地解释清楚。于是这两天仔细阅读了CSS2.1 spe
阅读全文
摘要:1、正方形 代码如下: #square { width: 100px; height: 100px; background: red; } #square { width: 100px; height: 100px; background: red; } #square { width: 100px
阅读全文
摘要:使用koala编译 Koala 是一款由国人开发的开源预处理语言图形编译工具,目前已支持 Less、Sass、Compass 与CoffeeScript。 目前支持以下系统:Windows,Mac, 10.7+,Linux: 32bit / 64bit,Ubuntu: 32bit / 64bit;
阅读全文
摘要:实现一个页面功能总是需要 JavaScript、CSS 和 Template 三种语言相互组织,所以我们真正需要的是一种可以将 JavaScript、CSS 和 Template 同时都考虑进去的模块化方案。 前端模块化带来的性能问题 很多主流的模块化解决方案通过 JavaScript 运行时来支持
阅读全文
摘要:浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过window.navigator.useragent这样的js来直接判断就可以了! 但是针对浏览器版本要求比较高的时候,如果只是单纯的判断浏览器的名字的话还不能解决问题,这时候就要通过其他方式来实现!现有的jquery已经废
阅读全文
摘要:HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单。 HTML5的新标签元素有: <header>定义页面或区段的头部; <footer>定义页面或区段的尾部; <nav>定义页面或区段的导航区域; <se
阅读全文
摘要:X-UA-Compatible是针对ie8新加的一个设置,对于ie8之外的浏览器是不识别的,这个区别与content="IE=7"在无论页面是否 包含<!DOCTYPE>指令,都像是使用了 Windows Internet Explorer 7的标准模式。而content="IE=EmulateIE
阅读全文
摘要:标题 标题 标题 标题是每篇文章都需要也是最常用的格式,在 Markdown 中,如果一段文字被定义为标题,只要在这段文字前加 # 号即可。 # 一级标题 ## 二级标题 ### 三级标题 以此类推,总共六级标题,建议在井号后加一个空格,这是最标准的 Markdown 语法。 列表 熟悉 HTML
阅读全文
摘要:变量 很容易理解: 输出: 甚至可以用变量名定义为变量: 解析后: 请注意 LESS 中的变量为完全的 ‘常量’ ,所以只能定义一次. 混合 在 LESS 中我们可以定义一些通用的属性集为一个class,然后在另一个class中去调用这些属性. 下面有这样一个class: 那如果我们现在需要在其他c
阅读全文
摘要:ES6入门 http://es6.ruanyifeng.com/ ES6排名前十的最佳特性列表 Default Parameters(默认参数) in ES6 Template Literals (模板文本)in ES6 Multi-line Strings (多行字符串)in ES6 Destru
阅读全文
摘要:Function类型 由于函数是对象,因此函数名实际上是一个指向函数对象的指针,不会与函数绑定 所以没有重载这个概念!!!!!!!!!!!!!!!!!!!!!!!!!! ECMAScript中的参数 参数在内部用arguments对象数组来访问,只关心参数数组,不关心参数个数 arguments的值
阅读全文
摘要:5种简单数据类型(基本数据类型) undefined null boolean number string (还有一种复杂的数据类型:object) 变量的两种不同的数据类型:基本类型(简单数据段)、引用类型(可能由多个值构成对象) 1、基本类型 num1与num2完全独立,不会相互影响 2、引用类
阅读全文
摘要:String 对象 String 对象用于处理文本(字符串)。 创建 String 对象的语法: 参数 参数 s 是要存储在 String 对象中或转换成原始字符串的值。 返回值 当 String() 和运算符 new 一起作为构造函数使用时,它返回一个新创建的 String 对象,存放的是字符串
阅读全文
摘要:定义数组 数组对象用来在单独的变量名中存储一系列的值。 我们使用关键词 new 来创建数组对象。下面的代码定义了一个名为 myArray 的数组对象: 有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样)。 1: 也可以使用一个整数自变量来控制数组的容量: 2: 注
阅读全文
摘要:1、条件选择 if 语句:只有当指定条件为true时,使用该语句来执行代码 if...else语句:当条件为true时执行代码,当条件为 false 时执行其他代码 if...else if....else 语句:使用该语句来选择多个代码块之一来执行 switch语句: 使用该语句来选择多个代码块之
阅读全文
摘要:定义 RegExp RegExp 对象用于存储检索模式。 通过 new 关键词来定义 RegExp 对象。以下代码定义了名为 patt1 的 RegExp 对象,其模式是 "e": 当您使用该 RegExp 对象在一个字符串中检索时,将寻找的是字符 "e"。 RegExp 对象的方法 RegExp
阅读全文
摘要:基本的BOM体系结构图 window子对象 document 对象 frames 对象 history 对象 location 对象 navigator 对象 screen 对象 window对象关系属性 parent:如果当前窗口为frame,指向包含该frame的窗口的frame (frame)
阅读全文
摘要:DOM 中的三个字母,D(文档)可以理解为整个 Web 加载的网页文档;O(对象)可以理解为类似 window 对象之类的东西,可以调用属性和方法,这里我们说的是 document对象;M(模型)可以理解为网页文档的树型结构。 DOM 有三个等级,分别是 DOM1、DOM2、DOM3,并且 DOM1
阅读全文
摘要:运算符 = 用于赋值。 运算符 + 用于加值。 运算符 = 用于赋值。 运算符 + 用于加值。 运算符 = 用于给 JavaScript 变量赋值。 算术运算符 + 用于把值加起来。 y=5; z=2; x=y+z; 在以上语句执行后,x 的值是 7。 运算符 = 用于给 JavaScript 变量
阅读全文
摘要:前端工程师在使用photoshop之前需要进行一些初始化设置,主要包括以下3个 【1】首选项设置 <ctrl+k> 【2】面板设置(在窗口菜单下) 1、工具(可切换两列或单列布局) 2、选项(与当前选中的工具一一对应) 3、信息<F8>(颜色、位置、尺寸信息,一般结合矩形选框工具使用) 4、图层<F
阅读全文
摘要:一、变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域。 变量的作用域无非就是两种:全局变量和局部变量。 Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。 var n=999; function f1(){ alert(n); } f1(); // 9
阅读全文
摘要:MVVM 数据绑定 MVVM的本质是通过数据绑定链接View和Model,让数据的变化自动映射为视图的更新。Vue.js在数据绑定的API设计上借鉴了Angular的指令机制:用户可以通过具有特殊前缀的HTML 属性来实现数据绑定,也可以使用常见的花括号模板插值,或是在表单元素上使用双向绑定: 插值
阅读全文
摘要:JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? JavaSript模块化 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理。模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管
阅读全文
摘要:分别归类为: 1 .javascript变量 2. javascript运算符 3. javascript数组 4. javascript流程语句 5. javascript字符串函数 6. javascript函数基础 7. javascript基础DOM操作 8. 文档对象模型DOM 9. ja
阅读全文
摘要:sublime Text的另一个强大之处在于它提供了非常丰富的插件,可以帮助程序员来适合大多数语言的开发。这些插件通过它自己的Package Controll(包管理)组件来安装,非常方便。一般常用的插件包括: Zen Coding -- 一种快速编写HTML/CSS代码的方法JQuery pack
阅读全文
摘要:使用webstorm上传代码到github 字数681 阅读330 评论0 喜欢5 之前使用过webstorm上传代码到github,过了几个月竟然发现自己忘记了,好记性不如烂笔头啊,今天又重新用了一下,还是记一下的比较好。 用webstorm上传代码时,首先要先下载git,网址一搜就可以搜到,然后
阅读全文
摘要:例子: Example: 保存数据到服务器,成功时显示信息。 1 2 3 4 5 6 7 $.ajax({ method: "POST", url: "some.php", data: { name: "John", location: "Boston" } }).done(function( ms
阅读全文
摘要:jQuery.ajax( url [, settings ] ) url 类型: String 一个用来包含发送请求的URL字符串。 settings 类型: PlainObject 一个以"{键:值}"组成的AJAX 请求设置。所有选项都是可选的。可以使用$.ajaxSetup()设置任何默认参数
阅读全文
摘要:exports._esModule = true; exports.default = { prefix: function prefix(prop){ if (prop[0] === '-'){ var sep = prop.indexOf('-' ,1 ); return prop.s...
阅读全文
摘要:一、MVC MVC模式的意思是,软件可以分成三个部分。 视图(View):用户界面。 控制器(Controller):业务逻辑 模型(Model):数据保存 各部分之间的通信方式如下。 所有通信都是单向的。 二、互动模式 接受用户指令时,MVC 可以分成两种方式。一种是通过 View 接受指令,传递
阅读全文
摘要:Box:CSS布局的基本单位 Formatting context是页面中的一块渲染区域,最常见的是BFC和IFC,CSS3增加了GFC和FFC BFC定义:块级格式化上下文,它是一个独立的渲染区域,只有Block-level box参与,它规定了内 部的Block-level Box如何布局,并且
阅读全文
摘要:1、选择器HACKS /*IE6及以下*/ *html #uno{...} /*IE7*/ *:first-child+html #dos{...} /*IE7,FF,Saf,Opera*/ html>body #tres{...} 2、属性HACKS /*IE6*/ #once{_color:bl
阅读全文
摘要:1、JSONP的作用 由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源,为 了实现跨域请求,可以通过script标签实现跨域请求,然后再服务器端输出JSON数据并执行回调函 数,从而解决了跨域的数据请求。 JSONP协议的一个要点:允许用户传递一个callb
阅读全文
摘要:需要修改IE6下的bug,margin负值会在IE6下失效
阅读全文
摘要:1、回调就是一个函数的调用过程,函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b, 那么这个过程就叫回调 eg. 运行结果: parent callback b 2、回调什么时候执行 回调函数一般在同步情境下是最后执行的,在异步情况下是有可能不执行的,因为事件没有被触发或者 条件不
阅读全文
摘要:Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生。它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,比如下面的演示: Zen coding下的编码演示 去年年底,该插件已经改名为Emmet。但Emmet不只改名,还带来
阅读全文
摘要:目前没有浏览器支持boc-flex属性。 Firefox支持代替的-moz-box-flex属性 Safari、Opera以及Chrome支持替代的-webkit-box-flex属性 box-flex的含义:用来按比例分配父标签的宽度(或高度)控件 box-flex值至少为1时起作用 eg. 显示
阅读全文
摘要:1、stringify() JavaScript对象序列化为JSON字符串 eg1. var book = {title: 'JS', authors: ['Van'], edition:3, year:2011}; var jsonText = JSON.stringify(book); 默认情况
阅读全文
摘要:懒加载(Load On Demand)是一种独特而又强大的数据获取方法,它能够在用户滚动页面的时候自动获取更多的数据, 而新得到的数据不会影响原有数据的显示,同时最大程度上减少服务器端的资源耗用。 比如,用户滚动到相应位置时,显示相应的图片,否则不加载!!! 下面是一个图片懒加载的示例. 这个htm
阅读全文
摘要:1、html中直接使用设置锚点,即将a标签的herf设成要定位到的位置上的元素的id。 示例如下: 定位到div id="pos",则给一个a标签 2、使用js定位,这种方法比较灵活,而且可以制造出一些滚动效果 下面是一个使用greensock个TweenMax实现平滑滚动到指定位置的示例: htm
阅读全文
摘要:有如下需求,页面中包含数个标签,每个标签数个监听事件,并随事件类型的不同,进行不同的处理操作。 html中部分代码如下: js实现事件代理: 所以如果要在这些子元素上对监听到的不同事件类型实现不同的操作,只需进行如下调用:
阅读全文