- 博客(27)
- 收藏
- 关注
RSS订阅原创 VUE项目编程规范实践
文章目录1 开发环境1.1 开发工具1.2 安装方法2 命名规则2.1 文件及文件夹2.2 变量、常量及方法2.3 HTML及CSS3 开发规则3.1 注释3.1.1 文件头部注释3.1.2 行注释3.1.3 段注释3.2 语法规则3.2.1 JavaScirpt3.2.2 HTML3.2.3 CSS3.2.4 Vue4 css4.1：像素单位统一采用rem（1rem = 100px）（边框固定为...
2019-02-15 17:12:03
391
原创 ES6核心简介
#1. es6基础 1.let（块级作用域）和const（常量） 2.变量结构赋值 3.字符串扩展 4.数值扩展 5.函数扩展 6.数组扩展 7.对象扩展 8.正则扩展#2. Set和Map set：它类似于数组，但是成员的值都是唯一的，没有重复的值。 map：JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键...
2019-02-15 16:46:17
386
原创 网页性能 -- 浏览器的repaint和reflow
#1.网页的生成过程浏览器从下载文件到显示页面是一个很复杂的过程。 浏览器下载完页面中的所有组件 – HTML标记、JavaScript、CSS、图片 – 之后会解析并生成两个内部数据结构： 1. DOM树 -- 表示页面结构 2. 渲染树 -- 表示 DOM 节点在页面中如何显示（宽高、位置等）下面我们来看一下网页具体的一个生成过程，如下图： HTML代码转...
2018-06-27 11:47:22
639
原创 VUE组件间的通信
#1 父子组件之间的通信在 Vue.js 中，父子组件的关系可以总结为 props down, events up 。父组件通过 props 向下传递数据给子组件，子组件通过 events 给父组件发送消息。看看它们是怎么工作的。#1.1 父组件到子组件使用props传递数据prop 是父组件用来传递数据的一个自定义属性。子组件需要显式地用 props 选项 声明 “prop”：...
2018-06-20 12:17:17
165
原创 自定义滚动条样式
#1自定义webkit内核浏览器滚动条样式在所有浏览器，滚动条可定制性最强的当属webkit内核的浏览器了。因为源代码开放的原因，市面上基于webkit内核的浏览器也是很难穷举完。例如有：Google Chrome、Opera（opera已经使用webkit内核了）、360极速浏览器，猎豹浏览器等，搜狗浏览器······// CSS::-webkit-scrollbar
2018-06-14 17:24:40
256
原创 cnpm 安装出错怎么办？
首先输入以下命令并回车npm set registry https://registry.npm.taobao.org # 注册模块镜像npm set disturl https://npm.taobao.org/dist # node-gyp 编译依赖的 node 源码镜像npm cache clean --force # 清空缓存然后再npm install -g cnpm --regist
2017-11-21 19:14:23
963
转载 vue开源项目库汇总
UI组件 element ★12468 - 饿了么出品的Vue2的web UI工具套件 Vux ★7759 - 基于Vue和WeUI的组件库 iview ★6121 - 基于 Vuejs 的开源 UI 组件库 mint-ui ★5827 - Vue 2的移动UI元素 vue-material ★2997 - 通过Vue Material和Vue 2建立精美的app应用 muse-ui ★
2017-08-03 11:49:54
3269
原创 图片预览插件-photoswpie
#1简介 PhotoSwipe 是专为移动触摸设备设计的相册/画廊.兼容所有iPhone、iPad,以及桌面浏览器.底层实现基于HTML/CSS/JavaScript,是一款免费开源的相册产品。官方网站：http://photoswipe.com/ 源码下载：https://github.com/dimsemenov/photoswipe 国内CDN：http://www.bootc
2017-07-26 15:13:55
885
1
原创 关于移动端本地代码调试（基于android和chrome）
1.准备基于windows下的chrome和android系统的是手机进行调试的时候是有一些先决条件,那么先说一下基本的要求:开发计算机（Windows）上已安装 Chrome 32 或更高版本。 开发计算机（Windows）上已安装 USB 驱动程序（官方驱动，豌豆荚，360助手等等 ）。确保设备管理器报告正确的 USB 驱动程序拥有一根可以将您的 Android 设备
2017-07-11 14:46:49
1511
原创 sublime text注册码（秘钥）
—– BEGIN LICENSE —– TwitterInc 200 User License EA7E-890007 1D77F72E 390CDD93 4DCBA022 FAF60790 61AA12C0 A37081C5 D0316412 4584D136 94D7F7D4 95BC8C1C 527DA828 560BB037 D1EDDD8C AE7B379F 50C9D69D
2017-04-06 17:27:12
12750
原创 sublime text3 插件推荐
sublime text3使用了小半年后，觉得还不错，所以特地推荐给大家。这里主要给大家推荐常用的一些插件； 1.下载sublime text3 安装package control import urllib.request,os; pf = ‘Package Control.sublime-package’; ipp = sublime.installed_packages_path();
2017-03-31 16:57:15
1060
原创 HTML 编码规范
#语法用两个空格来代替制表符（tab），保证在所有环境下获得一致展现的方法。 嵌套元素应当缩进一次（即两个空格）。 对于属性的定义，确保全部使用双引号，绝不要使用单引号。 不要在自闭合（self-closing）元素的尾部添加斜线，[HTML5 规范](http://dev.w3.org/html5/spec-author-view/syntax.html#syntax-start-tag)中明确
2017-03-29 17:32:42
588
原创 chrome设置ajax跨域
ajax本身是不支持跨域的，而我们在开发工作中，可能会遇到本地开发环境未配置相关代码，需要到其他服务器上获取数据的情况，尤其在用HTML5开发app的过程中，前后台完全分离，使用Ajax进行数据交互，这种情况非常常见。我们可以通过对谷歌浏览器进行设置以方便跨域调用数据做测试。chrome浏览器版本在49以前–disable-web-securitychrome浏览器版本在49以后具体做法为：在电
2017-03-18 19:12:06
2318
原创 this
this是Javascript语言的一个关键字。this代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。比如，function test(){ this.name = 'test';}this的值会随着函数使用场合的不同而发生变化。但是不变的是，this指的是，调用函数的那个对象。关于this指向问题，与函数调用息息相关，其可大致分为四类情况：方法调用； 即作为某对象的方
2017-03-07 16:46:11
259
原创 js继承
构造函数绑定使用call或apply方法，将父对象的构造函数绑定在子对象上，即在子对象构造函数中加一行：function Person(){ this.nationality= "中国人";}function Student(name,age){ Person.apply(this, arguments); // 或 Person.call(this,a1,a2,
2017-03-02 10:19:36
233
原创 Js原型（prototype）和原型链（__proto__）
javascript对象JavaScript 中，万物皆对象！分为两类：普通对象(Object )和函数对象(Function)。下面举例说明：function f1(){}var f2 = function(){};var f3 = new Function('str','console.log(str)');var o1 = {};var o2 = new Object();var
2017-03-01 16:45:57
355
原创 Javascript闭包（Closure）
介绍闭包前，先了解一下js的变量作用域。变量作用域在JavaScript中，用var申明的变量实际上是有作用域的。如果一个变量在函数体内部申明，则该变量的作用域为整个函数体，在函数体外不可引用该变量：function f1(){ var x = 1; x += 1;}x = x + 2; // ReferenceError! 无法在函数体外引用变量x如果两个不同函数各自声明了
2017-03-01 15:58:09
215
原创 几种主要的浏览器内核
Trident内核代表产品Internet Explorer，又称其为IE内核。Trident（又称为MSHTML），是微软开发的一种排版引擎。使用Trident渲染引擎的浏览器包括：IE、傲游、世界之窗浏览器、Avant、腾讯TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等。Gecko内核代表作品Mozilla Firefox
2017-03-01 14:52:16
331
原创 flex布局（Flexible Box）
前言上一篇，我刚刚整理了水平垂直居中，在这里顺便整理了flex布局。我们都知道传统的布局是基于盒模型。而盒模型布局主要依赖于position、display和float属性，对于部分特别要求的布局实现比较困难，比如垂直居中，是实现起来就比较困难。这里felx布局实现起来就比较容易很多，比较重要的一点是，flexbox布局是方向无关的，而不是常规布局（块是基于垂直的和内联的，是水平的）。基础和语法在
2017-02-28 17:11:28
617
原创 水平垂直居中
水平垂直居中已知宽高的div.test{ width: 100px; height: 100px; position: absolute; background: pink; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px;} 效果如下： 那么此方法能不能
2017-02-22 11:24:26
342
原创 消除img之间的间距
如上图所看到，图片之间有间隔。经过实践，以下两种方法分享给大家：flex布局；给父元素加上font-size:0；矫正过的结果如下：
2017-02-21 17:23:07
2467
原创 CSS 选择符
1.id选择器（ # myid） 2.类选择器（.myclassname） 3.标签选择器（div, h1, p） 4.相邻选择器（h1 + p） 5.子选择器（ul < li） 6.后代选择器（li a） 7.通配符选择器（ * ） 8.属性选择器（a[rel = “external”]） 9.伪类选择器（a: hover, li: nth - child）可继承的样式： fon
2017-02-21 16:57:47
194
原创 CSS 编码规范
1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-height, letter-spacing, color, text-align等) 4.背景(background, border等) 5.其他(animation, t
2017-02-21 16:51:35
269
原创 git使用心得
创建新仓库创建新文件，打开，然后执行git init以创建新的git仓库检出仓库执行如下命令以创建一个本地仓库的克隆版本:git clone /path/to/repository如果是远端服务器上的仓库，你的命令会是这个样子：git clone username@host:/path/to/repository工作流你的本地仓库由 git 维护的三棵“树”组成。第一个是你的 工作目录，它持有实际文
2017-02-21 16:42:53
223
原创 gulp使用心得
Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。Gulp.js 是基于 Node.js 构建的,利用 Node.js 流的威力,你可以快速构建项目；一、gulp安装 gulp是基于NodeJS运行的，所以需要想安装NodeJS. http://nodejs.org/download/ 安装gulp：# 安装全局环境npm install gul
2016-12-01 15:13:06
480
原创 less开发（二）--基本语法
（一）嵌套规则 【1】less可以让我们以嵌套的方式编写层叠样式，先看下面这段CSS；.box-a .hd { height: 20px;}.box-a .bd .txt { color: #000;}.box-a .other { position: relative;} 在LESS中，可以用嵌套方式写以上代码：.box-a{ .hd{ height
2016-11-21 17:04:30
422
原创 less开发（一）
【一】less简介 LESS（是.less后缀名的文件） 包含一套自定义的语法及一个解析器，我们根据这些语法定义自己的样式规则，这些规则最终会通过解析器，编译生成对应的 CSS 文件。LESS 并没有裁剪 CSS 原有的特性，更不是用来取代 CSS 的，而是在现有 CSS 语法的基础上，为 CSS 加入程序式语言的特性，如变量、继承、运算、嵌套等，更方便CSS的编写和维护。先看下段less代码片段
2016-11-21 16:43:28
475
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人