李小tt-CSDN博客

原创 javascript弃坑之路之原来是这样的this

说this是js编程中最重要的变量也不为过了，而在遇到this时，也曾经傻傻分不清楚this指代的到底是什么,所以现在对曾踩过this的坑做一下总结。this的场景虽然this很令人迷惑，但其实总会发现，在浏览器环境中,this的指代不外乎两种，要么是window，要么是某个特定的对象（window之外的对象）,而涉及到具体的场景中this的取值，可以归纳为五种。全局作用域中直接调用thisvar

2018-01-04 08:08:25 229

原创 React技术栈之为什么选择react

React起源于Facebook公司的内容项目，该公司在尝试用H5来建设Instagram网站的过程中发现，对于复杂前端h5性能下降明显，在对市场的mvc框架分析后，依然无法找到满足自己需求的框架，于是决定自己开发一套，于是就有了之后的React,React于2013年开发完成后被开源，一经发布迅速吸引了广泛的关注。 React的设计思想极其独特，其核心理念-虚拟Dom思想也在陆续被其他优秀框架引

2017-12-17 16:23:15 1229

原创合并垂直外边距

在普通块级元素的垂直格式化元素的垂直格式化一文中，我们提到，块级元素在某些情况下会发生垂直方向的外边距的合并，本文来总结一下垂直外边距合并的场景以及如何避免发生垂直外边距的合并。垂直外边距合并的场景两个相邻的兄弟元素两个相邻的兄弟元素，即当两个元素是相邻的，且是同一个父元素时，上方元素的margin-bottom和下方元素的margin-top会发生垂直外边距合并 2.元素和它的首尾子元素

2017-11-08 22:49:30 355

原创普通块级元素的垂直格式化

普通块级元素的垂直格式化之前写了普通流中块级元素的水平格式化和margin一文，整理了普通流中的块级元素在水平方向的格式化，其中重点介绍了七个和宽度有关的属性（margin-left,border-left,padding-left,width,padding-right,border,margin-right），本文接下来介绍块级元素的垂直格式化以及相关的属性，和水平格式化一样，垂直格式化同样存在

2017-11-07 22:22:30 297

原创水平居中的几种方法-margin,text-align

水平居中的几种方法-margin,text-align在对元素进行水平居中时，可能会有多种方法，但不同的居中方法的适用场景也可能是不相同的。margin设置为auto来水平居中我们知道，在普通流的块级元素中，元素的七个水平属性相加的和等于包含块的width值，利用这个属性，将margin-left,和margin-width两个值设置为auto,它们会被剩下的值均分，设置为相同的长度（注意width

2017-11-06 08:00:55 7597 1

原创普通流中块级元素的水平格式化和margin

普通流中块级元素的水平格式化我们普遍认为，普通流中块级元素的布局比较易预测，水平方向的表现于垂直方向上还要更容易，通常依据父元素的宽度就很容易确定，但也有让人惊讶的部分，比如元素在水平方向的auto值会有何影响，子元素为什么有时候在水平方向上会超出父元素的内容区，要清楚这些原因就要了解元素在水平方向的格式化原理。水平方向的宽度依赖继承父元素水平格式化往往没有想象的那样简单，其中部分原因是width影

2017-11-05 09:48:07 493

原创 line-height,vertical-align,margin,padding对行框高度的影响

line-height,vertical-align,margin,padding对行框高度的影响我们知道，在行内布局中，每行的一个或多个行内元素组成行框，行框是包含改行出现的行内框的最高点和最低点的最小框。只要确定了每个行内框的高度以及摆放位置，即确定了行框的高度。行内元素的摆放位置行内元素的摆放位置与vertical-align有着密不可分的关系，默认情况下，vertical-align的值是b

2017-10-29 09:55:19 1048

原创重新认识font-size、line-height和行高

重新认识font-size、line-height和行高line-height，font-size均是css格式中很常设置的样式，这两个样式会对元素产生什么影响呢？从样式的名字来看，分别代表行高和字体大小的意思，那么line-height真的等于行高吗？font-size又是否和行高有关系呢？基本定义首先来看一些术语的基本定义line-height：line-height属性是指文本行基线之间的距

2017-10-25 22:41:27 9017 1

原创 line-height属性技巧

line-height属性技巧使只含一行内容的段落的文字内容水平居中line-height是一种文本属性，指示行高，浏览器默认的行高较小，通常使段落文字显得比较密集，增加行高可以使段落看上去更加舒服。行高可以以像素作为单位，如(px,em),也可以以百分比作为单位，如下设置行高为基准值的1.5倍p{ line-height:150%}除了疏松文字在高度之间的距离的用途外，行高还可以附带的实现垂

2017-10-20 08:44:39 5741

原创 apply,call,bind的区别

apply,call,bind的区别首先，每个函数都包含两个非继承而来的方法，call和apply,而这两个方法的作用及其相似，即均为在特定的作用域中调用函数，即设置this的值**传递参数**扩充函数赖以运行的作用域applyapply方法接收两个参数，第一个参数为制定函数的执行作用域，第二个参数是一个数组，可以是Array实例，也可以是一个arguments对象。如：function ad

2017-10-18 08:07:50 241

原创 react之flux小结

react之flux小结flux是facebook开源的一个单向数据流的框架。flux架构应用一般由以下几部分组成：store 存储应用的状态数据dispatcher 负责动作的分发和处理，维护store的数据action 触发dispatcher的动作分发，并传递数据view 视图，作为与用户交互的入口如react组件首先创建Action,这些action会暴露给外部，作为改变state

2017-08-27 23:47:38 267

原创函数中this的值为什么与包含函数this的值无关

＃函数中this的值为什么与包含函数this的值无关一直有一个疑问，当访问一个某函数内不存在的变量时，如果这个函数的包含函数定义了该变量，则在该函数的内部也能访问到该变量，那为什么该函数内访问this时和其包含函数的this值会不一样呢？如下所示var b=4;var c=11;function Test(a,b){ this.a=a; this.b=b; funtio

2017-08-21 23:21:56 273

原创从图文混排到浮动之BFC清除浮动

从图文混排到浮动之BFC清除浮动继续上一个疑问，现在p段落的内容是整个包裹住图片的，但如果我既想让p段落的内容显示在img图片的右侧，又想让它布局工整，即从上到下垂直无错位的排列要怎么做呢？为了完成这个格式，我写下了这样一段代码：<html><head><style type="text/css">img {width:50px;height:50px;float:left;}di

2017-08-21 22:22:08 336

原创从图文混排到浮动

从图文混排到浮动在浮动上踩过很多的坑，各种关于浮动的总结也不少，这里也就自己最近的学习谈一谈我对浮动的理解～关于浮动最经典的莫过于图文混排了，印象中的图文混排是这样的：为了完成这个格式，我写下了这样一段代码：<html><head><style type="text/css">img {width:50px;height:50px;}</style><body><im

2017-08-04 00:03:11 1479

u010250808的博客