web前端
文章平均质量分 71
幸福的雏
具有像素眼的前端工程师
展开
-
网站性能优化
网站前端性能优化的方式方法,总共收藏了有14中手段。原创 2016-04-09 13:13:03 · 588 阅读 · 0 评论 -
html5移动端知识点总结(一)
第1章 使用rem作为单位html{font-size:10px}1.1使用媒体查询,不同分辨率设置不同的html的font-size@(min-width:320px){ html{font-size:10px;}}@(min-width:360px){ html{font-size:11.25px;}}@(min-width:400px){ html{font-s原创 2016-09-14 17:34:58 · 2882 阅读 · 2 评论 -
html5移动端开发
第一章 APP分类native appweb apphybid app移动web(移动web站点,web触屏版)第二章 移动端web开发要面对的问题2.1兼容问题UC、Chrome、Safari、QQ浏览器、百度浏览器、360浏览器等手机上的浏览器几乎全部都是基于webkit内核2.2适配问题首先采用百分比自适应布局(即流式布局) 同时,需要对一定段的viewprot视口进行设置,就能达原创 2016-08-10 11:54:10 · 1015 阅读 · 0 评论 -
前端代码规范(静态检查)工具
CSSLint官网:http://csslint.netCSSLint是一个用来帮你找出CSS代码中问题的工具,它可做基本的语法检查以及使用一套预设的规则来检查代码中的问题,规则是可以扩展的。JSHint官网:http://jshint.comJSHint是一个JavaScript的代码质量检查工具,主要用来检查代码质量以及找出一些潜在的代码缺陷。使用方法:进入官网首页,粘贴你的代码,你的错误和不正原创 2016-06-07 18:57:20 · 12491 阅读 · 0 评论 -
前端单元测试工具
单元测试Unit Test 很早就知道单元测试这样一个概念,但直到几个月前,我真正开始接触和使用它。究竟什么是单元测试?我想也许很多使用了很久的人也不一定能描述的十分清楚,所以写了这篇文章来尝试描述它的特征和原则,以帮助更多人。一、什么是单元测试?先来看看单元测试的定义,在维基百科英文版中可以找到Kolawa Adam在 Automated Defect Prevention: Best Prac原创 2016-06-12 10:33:06 · 11714 阅读 · 0 评论 -
gulp教程之gulp中文API
src()gulp.src()方法输入一个glob(比如匹配一个或多个文件的字符串)或者glob数组,然后返回一个可以传递给插件的数据流。Gulp使用node-glob来从你指定的glob里面获取文件,这里列举下面的例子来阐述,方便大家理解:js/app.js 精确匹配文件js/*.js 仅匹配js目录下的所有后缀为.js的文件js/*/.js 匹配js目录及其子目录下所有后缀为.js的文件原创 2016-06-12 12:24:00 · 886 阅读 · 0 评论 -
gulp详细学习教程
对网站资源进行优化,并使用不同浏览器测试并不是网站设计过程中最有意思的部分,但是这个过程中的很多重复的任务能够使用正确的工具自动完成,从而使效率大大提高,这是让很多开发者觉得有趣的地方。一、概述gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器;她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成。使用她,我们不仅可以很愉快的编写代码,而且大大提高我原创 2016-06-08 14:09:15 · 635 阅读 · 0 评论 -
前端代码覆盖率工具istanbul
测试的时候,我们常常关心,是否所有代码都测试到了。这个指标就叫做“代码覆盖率”(code coverage)。它有四个测量维度:行覆盖率(line coverage):是否每一行都执行了?函数覆盖率(function coverage):是否每个函数都调用了?分支覆盖率(branch coverage):是否每个if代码块都执行了?语句覆盖率(statement coverage):是否每个原创 2016-06-12 10:00:12 · 3845 阅读 · 1 评论 -
hexo博客搭建并上传github
安装node.js 安装hexo npm install hexo -ghexo init blog hexo g hexo s注册github账号 创建仓库电脑生成ssh-keygithub上添加ssh-key修改_config.yml文件 deploy: type: git repo: git@github.com:codePan/blog.git branch:原创 2016-06-08 15:43:18 · 770 阅读 · 0 评论 -
Node.js学习
Node.js简介Node.js是一个建立在chorme浏览器V8JavaScript引擎上的一个JavaScript运行时(运行环境)。Node.js使用一个事件驱动,非阻塞I/O模型使她高效和不同。Node.js包的生态系统,npm,是一个全球最大的开源库生态系统。Node.js发明者的设计初衷最初的目标是写一个事件驱动、非阻塞I/O的web服务器后来变成构建网络应用基础框架,在此基础可以构原创 2016-06-01 15:44:43 · 1563 阅读 · 0 评论 -
畅捷通前端面试题
一、请写出一下每行代码的输出结果(6分)!!(0 == false)!!(0 == undefined)undefined == nullisNaN(1312") == NaNtypeof 1 == true ? 1: 0typeof [] == "array"[] instanceof Array二、请正确的写出下面代码在现代浏览器控制台中输出的结果(5分) for(var i = 0原创 2016-05-17 14:35:36 · 2484 阅读 · 0 评论 -
网站性能优化
第1章 网站前端性能优化前端近几年变化很大,各种工具,库,框架并发。虽然如此,但是网站前端性能优化的思路基本没变。 为什么前端性能如此重要?数据显示: 1)只有 10%~20%的最终用户响应时间花在了下载HTML文档上。其余的80%~90%时间花在了下载页面中的所有组件中; 2)另外一点是,优化后台需要花费比较大的成本,优化前端只需要适当地遵循一些法则会有较大的提升,相对低成本高收益。本文是根原创 2016-04-20 12:12:24 · 5056 阅读 · 0 评论 -
<meta>标签在移动端的定义
meta 标签分两大部分HTTP 标题信息(http-equiv)页面描述信息(name)http-equiv 属性Content-Type 值(显示字符集的设定)说明:设定页面使用的字符集,用以说明主页制作所使用的文字语言,浏览器会根据此来调用相应的字符集显示 page 内容。用法:<meta http-equiv="Content-Type" content="text/html; cha原创 2016-04-13 18:22:36 · 617 阅读 · 0 评论 -
响应式布局知识点总结
当今屏幕分辨率从 320px (iPhone) 到 2560px (大屏显示器) 或者更大。人们也不再仅仅用台式机来浏览网页,现在有手机,平板电脑等等。所以传统的固定宽度设计形式将不再是个最佳选择,网页设计需要有自适应性。网页的布局需要能够根据不同的分辨率和设备来自动调整,以达到到最佳显示效果。接下来会展示如何运用 HTML5 和 CSS3 来设计一个自适应网页。先看看它的效果在开始之前,点击最终预原创 2016-04-13 15:12:46 · 1560 阅读 · 0 评论 -
web App和hybid App框架
webApp/hybidApp框架 ionic,jQuery Mobile,Sencha Touch,MUIionicionic基于angularJS,phoneGapjQuery MobileSencha TouchMUIWeX5打包工具 phoneGap(cordova),AppCan,Worklight,AppMobi,WeX5,titaniun 其中WeX5为国内打造原创 2016-04-20 17:21:32 · 1292 阅读 · 0 评论 -
Javascript图标库
ECharts 1ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。ECharts 3 中更是加入了更多丰富的交互功能以及更多的可视化效果,并且对移原创 2016-05-11 15:37:40 · 1045 阅读 · 0 评论 -
跨域请求的概念和解决办法
相关概念 同源是指相同的协议、域名、端口,三者都相同才属于同源。 同源策略浏览器处于安全考虑,在全局层面禁止了页面加载或执行与自身来源不同的域的任何脚本,站外其他来源的脚本同页面的交互则被严格限制。 跨域由于浏览器同源策略,凡是发送请求url的协议、域名、端口三者之间任意一与当前页面地址不同即为跨域 跨域资源共享(Cross Origin Resource Sharing,CORS)是一个原创 2016-04-14 15:00:35 · 6418 阅读 · 0 评论 -
百度地图开发中遇到的问题
问题1:含有label的marker聚合时label消失问题问题描述:使用百度地图API实现marker聚合最简单的方式就是编写如下的代码:<script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay.js"></script><script转载 2016-11-29 17:32:19 · 4927 阅读 · 0 评论