自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(31)
  • 收藏
  • 关注

原创 关于同一行图片文字居中与对齐的问题

好久没写博客了,最近遇到一些同一行文字对齐与文字在图片旁边居中的问题,在这里记录一下。 比如我想实现以下布局:方法有很多种,我们可以用浮动来实现,具体代码就不在这里贴了,我主要记录用的是inline-block布局,我们可以看到,以上图片其实图片和图片右边的文字没有对齐,那么我们如何来实现呢?我直接用margin 来实现,但是看来看去总觉得不那么精准,后来查了一些资料,给图片设置了vertical

2016-11-29 15:45:43 664

原创 去除select下拉框默认样式以及一些兼容问题

今天遇到的问题,并在这里做一下记录和总结,快下班啦 happy!!!去除select下拉框默认样式select {/*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/border: solid 1px #000;/*很关键:将默认的select选择框样式清除*/appearance:none;-moz-appearance:none;-webkit-appearan

2016-09-30 16:25:07 14491

原创 call 和 apply的区别

一、方法的定义 call方法: 语法:call(thisObj,Object) 定义:调用一个对象的一个方法,以另一个对象替换当前对象。 说明: call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。 appl

2016-09-25 13:58:17 392

原创 jquery选择器

jquery的选择器很强大,这里简单总结一下常用的元素查找方法 $(“#myELement”) 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $(“div”) 选择所有的div标签元素,返回div元素数组 $(“.myClass”) 选择使用myClass类的css的所有元素 ("∗")

2016-09-25 11:57:48 238

原创 tcp/ip

建立tcp需要三次握手才能建立,而断开连接需要四次握手。 我们先看一下tcp,是如何建立连接的: 首先client端发送连接请求报文,server 端接收连接后回复ACK报文,并为这次连接分配资源。client 端接收到ACK报文后也向server 端发送ack报文,并分配资源,这样tcp连接就建立了。 那如何中断连接呢? 首先声明:中断连接可以是client 端,也可以是server端。

2016-09-25 11:08:11 227

原创 我对闭包的一些理解

闭包是很多语言都具备的特性,在js中,闭包主要涉及到js的几个其他的特性:作用域链,垃圾(内存)回收机制,函数嵌套,等等. 1.什么是闭包,说说你的理解,闭包的作用是什么 闭包简单的说就是定义在一个函数内部的函数,当内部函数 在定义它的作用域 的外部 被引用时,就创建了该内部函数的闭包 ,如果内部函数引用了位于外部函数的变量,当外部函数调用完毕后,这些变量在内存不会被 释放,因为闭包需要它们.我

2016-09-23 15:29:07 597

原创 解决IE8下的一些兼容性问题

1.使用meta标签调节浏览器的渲染方式,告诉浏览器用哪种内核渲染,360双核浏览器就是在ie和chrome之间来回切换,帮我们判断使用webkit还是chrome。 使用meta标签来强制IE8使用最新的内核渲染页面,代码如下:<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">一些兼容性问题 * 浏览器兼容问题一:块属性

2016-09-23 14:53:55 27861

原创 nth-child vs nth-of-type

今天我在做一个小案例的时候,遇到这样一个问题,我想让我的第二个section 变成绿色,于是我使用了nth-child,代码如下:section:nth-of-type(2){ background-color: #f5f5f5;}结果我第二个section,并没有变色,第一个section却变色了,我觉得很奇怪。 后来,我又去查了nth-type-of 与 nth-of-typ

2016-08-15 08:59:09 343

原创 移动端性能陷进和硬件加速

减少或避免repaint,reflow也可以理解为减少dom元素的操作页面重绘:颜色,字体发生一些变化就会触发浏览器 repaint,位置发生变化例如修改了top,就会触发浏览器reflow,reflow的dom元素开销的成本从感官上讲明显是大于repaint,《《高性能的javaScript》》把dom开销比作是一座链接html和js的一座桥梁,每过一次就会收一次过路费,所以我们要尽可能减少使用d

2016-08-08 15:46:55 1785

原创 进程 线程

什么是线程用来执行应用程序中的代码在一个进程内部,可以有很多线程在一个线程内部,同时只可以干一件事而且传统的开发方式大部分都是i/o阻塞的所以需要多线程来更好的利用硬件资源给人带来一种错觉:线程越多越好多线程都是假的,因为只有一个cpu(单核) 线程之间共享某些数据,同步某个状态都很麻烦 更致命的是: -创建线程耗费 -线程数量有限 -cpu 在不同线程之间转换,有上下文转换

2016-08-03 17:32:38 193

转载 webSockets

websocketswebsockets详解 HTML5 Web Sockets规范定义了Web Sockets API,支持页面使用Web Socket协议与远程主机进行全双工的通信。它引入了WebSocket接口并且定义了一个全双工的通信通道,通过一个单一的套接字在Web上进行操作。HTML5 Web Sockets以最小的开销高效地提供了Web连接。相较于经常需要使用推送实时数据到客户端甚至

2016-08-01 12:07:34 354

原创 css3新特性--弹性布局

今天谈谈我对css3 的出现的意义: css3增加了很多制作图片的新特性,例如圆角,阴影,文字阴影,以前我们都需要加载图片来完成,图片的加载速度很慢,现在我们只需要用css3就能实现。css3还增加了很多动画效果,以前我们要用flash做动画,让我们网页增加很多插件,不仅加载慢,还很厚重,苹果用户手机上用不了flash 注意在使用弹性盒模型的时候,父元素必须要加display:box;或disp

2016-08-01 08:40:39 335

原创 单页面应用程序

单页面应用程序优点:单页面应用程序缺点:无法做seo,html里只有一个壳子,所有的数据都是通过ajax来的,搜索引擎无法抓取到任何内容,谷歌的搜素引擎可以抓到ajax的内容,但百度目前还无法做到

2016-07-29 07:40:13 615

原创 css sprite 优缺点

今天出去面试,面试官问我,css sprite 是什么?说出她的优缺点,虽然知道一些,但是语言组织不够好,答的也不够完善,在这里我做了一下总结:css sprite 也可以说是叫图片精灵,也有人叫它雪碧图,它的原理是允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。加速的关键,不是降低重量,而是减少个数。传统切图讲

2016-07-27 20:19:29 679

原创 自执行函数的问题

在写js代码时,我们一般吧代码包在自执行函数里,(function(){ //独立的作用域但是,今天我遇到这样一个问题,我在一个js文件里,写了两个自执行函数,然后就报错了,再经过检查没发现任何语法问题,甚至我单独执行任何一个,都可以执行。后来,查了很多资料发现,第一个自执行函数后面必须加一个分号,就没错了//举个例子var btn =document.getElementById('bt

2016-07-26 11:33:45 317

原创 gulp

当前的前端·开发 -不再是简简单单的使用html+css+javascript这些简单的技术构建的技术构建网页应用程序了 -我们要提高效率,就必须减少重复的工作 -使用less之类预处理的css coffeescript -提供开发阶段的便利,开发阶段更快捷 现在的开发行业优质的开发人员是不应该将精力放在这些重复性质的工作上 -gulp就是一种可以自动化完成我们开发过程中大量的重复工作

2016-07-26 10:36:28 222

原创 关于node

为什么要有自动化流程? 在我们开发过程中有大量的重复操作,开发人员的精力应该放在创造上面,不应该放在重复的工作上面。 什么是node? 不是js文件,也不是js框是Server side Javascript runtime,服务端的一个js运行时 目前我们js是运行在浏览器内核中 nodejs就是一个运行环境 为什么node选择js node中只能运行ecmascript 不能运行b

2016-07-24 18:45:34 214

原创 一些前段面试回答技巧

1.什么是函数? 答:函数其实就是一个工具,我们只要学会是用这些工具实现某个功能,这就是封装性,我们不需要知道代码怎么写,只要知道函数的名称和所需要的参数就可以使用这个工具,比如alert(),我们看到的这个简单的方法,实际上他背后甚至有一千行代码,用·c语言写的 2.对象: 对象是一个包含很多工具的工具包,分类管理,类似的功能放在一起管理,工具包包含两种东西:方法和属性 整个js都是面向对

2016-07-23 18:34:08 292

原创 函数四种调用模式以及this指向

第一种:函数执行模式function add(a,b){ console.log(this); return a+b; } add();//this===window//true第二种:对象方法的调用模式function Cat(){ this.show = function(){ console.log(this); }

2016-07-17 18:16:47 578

原创 理解overflow

overflow 基本属性值visible(默认)hiddenscroll 纵向横向都会出现滚动条auto 图片尺寸溢出 会自动出现滚动条inherit IE8以上才支持 会有很多兼容性问题 overflow-x:hidden 水平方向隐藏,但竖直方向可能·会出现滚动条 overflow-y:hidden 与上面相反如果overflow-x 与 overflow-y值相同等

2016-07-09 14:17:51 1681

原创 angularJS

1.angularjs的核心思想 *依赖注入 *模块化 *双向绑定 *语义化标签 2.用途:轻松页面构建spa(单一页面应用程序) 单一页面应用程序: * 只有一个页面(整个的一个载体) * 内容全部是由AJAX方式呈现出来啦 * 带领当前市面上的框架走向模式化或者架构化 3.angularjs的优点:不用像jquery那样操作过多的dom,只需要改变数据模型就可以了 4,

2016-07-06 09:18:08 249

原创 清除浮动的几种方法

当元素a浮动时,他将不再处于普通文档流中,相当于浮在文档之上,不占据空间,但是会缩短行宽,产生文字环绕的效果。浮动带来的影响:1,父级的高度塌陷2.背景不能显示3.变框不能撑开4.margin值不能正确显示5.产生文字环绕的效果6.由于脱离文档流,不占位,而后面的元素未脱离文档流导致后面的元素被挡住下面我将会总结几种清除浮动的方法: 举一个简单的例子,我们找一张图片并让她向左浮动,代码

2016-07-03 19:41:43 326 1

转载 区分伪类和伪元素总结

标准的定义: CSS 引入伪类和伪元素的概念是为了实现基于文档树之外的信息的格式化。 伪类有::first-child ,:link:,vistited,:hover,:active,:focus,:lang 伪元素有::first-line,:first-letter,:before,:after 尽管,第一行和第一个元素,这两者的语意相似,但最后作用的效果却完全不同。所以,伪类和

2016-07-03 17:40:24 264

原创 css样式重置

作为一名切图仔,经常会遇到头疼的各大浏览器兼容性问题,确切的说是兼容它们“默认”的CSS样式表。重置样式成为我们为我们的网页梳妆打扮的第一步,也是关键性的一步。 以前我这样重置样式:*{ margin:0; padding:0;}后来通过看一些大神的博客以及查阅相关资料发现,上面的方式会让网页解析的很慢,于是我根据自己的需求,这样重置样式:body,html,div,blockq

2016-07-03 16:22:15 407

原创 cookie vs session

具体来说cookie机制采用的是在客户端保持状态的方案,而session机制是在服务器端保持状态的方案,session是基于cookie的。 cookie的优缺点: 优点:极高的扩展性和可用性 通过良好的编程,控制保存在cookie中的session对象的大小。 通过加密和安全传输技术(SSL),减少cookie被破解的可能性。 只在cookie中存放不敏感数据,即使被盗也不会有重大损失。

2016-06-25 20:28:14 230

原创 onmusemove vs onmousover

over,在鼠标指针移动到指定的对象上时发生。 move,在鼠标指针移动时发生。 就拿我刚刚遇到的一个问题举例,我 用canvas标签,创建了一个画布,并画了一个小矩形,我想让鼠标悬停到矩形区域时改变矩形填充色,这里只能监听整个画布,看起来应该用over,实际上用的却是move。因为,move在每次鼠标移动时,都会触发,会获得当前坐标值,用来判断这个点是否落在矩形内。若是用over,则会在进入画

2016-06-24 15:36:10 498

原创 获取非行间样式

if(Object.currentStyle){} 判断浏览器是否支持 该方法 currentStyle 是IE 独有的 可以取到 object 的 非行间 CSS 要想支持 FF 和 CH 需要做兼容 : var getStyle = function(ele, attr){ return ele.currentStyle

2016-06-24 15:34:35 192

原创 npm vs Bower区别

npm(Node Package Manager)是nodejs时代不可或缺的最好的包管理器,现在已经随nodejs官方包同时会安装到你的设备上去。只要给项目书写好package.json放于项目根目录(用命令npm install –sava-dev (express))这里的–save参数就是将安装的模块以及使用的版本号记录到package.json文件中,这样当我们需要将代码提交到代码托管时不

2016-06-17 11:02:11 3577 1

原创 响应式布局

响应式布局:响应式布局,简而言之,就是一个网站能够兼容多个终端---而不是为每个终端做一个特定的版本,这个概念是为解决移动互联网浏览而诞生的。其目的是为用户提供更加舒适的界面和更好的用户体验。优点:1):面对不同的分辨率设备灵活性强 2):能够快捷解决多设备显示适应问题缺点:1):兼容各种设备工作量大,效率低下 2):代码累赘,会出现隐藏无用的元素,加载时间较长利用响应式布

2016-06-04 11:06:41 221

原创 学习网站

学习网站最好的开源前端库 angular.js中文网站(包含require.js) angular.js中文文档 canvas学习 createjs demo 很多前端作品分享很多案例 nodejs 实验楼 ps学习 爱心表白墙 制作canvas游戏 十款超炫的HTML5游戏 npm包下载

2016-06-03 16:50:17 271

原创 attribute attr prop 区别

1.attr 与 prop的区别是什么? 这篇微博解释的很清楚 2.那么,什么时候使用attr(),什么时候使用prop()? *添加属性名称该属性就会生效应该使用prop(); *是有true,false两个属性使用prop(); *其他则使用attr(); 项目中jquery升级的时候大家要注意这点! 以下是官方建议attr(),prop()的使用: 使用说明表格看这里

2016-06-01 09:48:50 762

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除