diff --git a/01-html/01-html标签图文详解（一）.md b/01-html/01-html标签图文详解（一）.md index ccfeceb..883bd47 100644 --- a/01-html/01-html标签图文详解（一）.md +++ b/01-html/01-html标签图文详解（一）.md @@ -908,7 +908,7 @@ href是英语`hypertext reference`超文本地址的缩写。读作“喝瑞夫 如果我们将上图中的第28行代码写成： ```html -回到顶部 +回到顶部 ``` 那就表示，点击之后，跳转到`a.html`页面的`name1锚点`中去。 diff --git a/02-CSS/02-CSS属性：背景属性.md b/02-CSS/02-CSS属性：背景属性.md index 8fd1969..c1853de 100644 --- a/02-CSS/02-CSS属性：背景属性.md +++ b/02-CSS/02-CSS属性：背景属性.md @@ -279,7 +279,7 @@ PS：padding的区域也是有背景图的。 ### background 综合属性 -background属性和border一样，是一个综合属性，可以将多个属性写在一起。(在[盒子模型](http://www.cnblogs.com/smyhvae/p/7256371.html)这篇文章中专门讲到boder) +background属性和border一样，是一个综合属性，可以将多个属性写在一起。(在[盒子模型](http://www.cnblogs.com/smyhvae/p/7256371.html)这篇文章中专门讲到border) 举例1: diff --git a/02-CSS/06-CSS盒模型详解.md b/02-CSS/06-CSS盒模型详解.md index 24a44d6..3f3bfe7 100644 --- a/02-CSS/06-CSS盒模型详解.md +++ b/02-CSS/06-CSS盒模型详解.md @@ -172,7 +172,7 @@ CSS盒模型和IE盒模型的区别： #### padding区域也有颜色 -padding就是内边距。padding的区域有背景颜色，css2.1前提下，并且背景颜色一定和内容区域的相同。也就是说，background-color将填充**所有boder以内的区域。** +padding就是内边距。padding的区域有背景颜色，css2.1前提下，并且背景颜色一定和内容区域的相同。也就是说，background-color将填充**所有border以内的区域。** 效果如下： diff --git a/02-CSS/07-浮动.md b/02-CSS/07-浮动.md index 1fce491..8ddfced 100644 --- a/02-CSS/07-浮动.md +++ b/02-CSS/07-浮动.md @@ -237,7 +237,7 @@ css中一共有三种手段，使一个元素脱离标准文档流： ![](http://img.smyhvae.com/20170801_1720.png) -上图中，div本身是块级元素，如果不设置widh，它会单独霸占整行；但是，设置div浮动后，它会收缩 +上图中，div本身是块级元素，如果不设置width，它会单独霸占整行；但是，设置div浮动后，它会收缩 ### 浮动的补充（做网站时注意） @@ -816,39 +816,6 @@ _zoom:1; 如果不在标准流，比如盒子都浮动了，那么两个盒子之间是没有塌陷现象的。 - - - -### 善于使用父亲的padding，而不是儿子的margin - -我们来看一个奇怪的现象。现在有下面这样一个结构：（div中放一个p） - -``` -
-

-
-``` - -上面的结构中，我们尝试通过给儿子`p`一个`margin-top:50px;`的属性，让其与父亲保持50px的上边距。结果却看到了下面的奇怪的现象： - -![](http://img.smyhvae.com/20170806_1537.png) - - -此时我们给父亲div加一个border属性，就正常了： - -![](http://img.smyhvae.com/20170806_1544.png) - - - -如果父亲没有border，那么儿子的margin实际上踹的是“流”，踹的是这“行”。所以，父亲整体也掉下来了。 - -**margin这个属性，本质上描述的是兄弟和兄弟之间的距离； 最好不要用这个marign表达父子之间的距离。** - -所以，如果要表达父子之间的距离，我们一定要善于使用父亲的padding，而不是儿子的margin。 - - - - ### 盒子居中`margin:0 auto;` margin的值可以为auto，表示自动。当left、right两个方向都是auto的时候，盒子居中了： diff --git a/02-CSS/09-CSS案例讲解：博雅互动.md b/02-CSS/09-CSS案例讲解：博雅互动.md index 852eedb..75a34e0 100644 --- a/02-CSS/09-CSS案例讲解：博雅互动.md +++ b/02-CSS/09-CSS案例讲解：博雅互动.md @@ -13,7 +13,7 @@ 这里我们要普及一个概念，叫“[版心](https://baike.baidu.com/item/%E7%89%88%E5%BF%83)”。**版心是页面中主要内容所在的区域。** -比如说，网站左上角的logo，设计图给出的左边距是143像素，此时，我们先玩不要以为，logo的左边距真的是143像素。因为设计图只是一个版心；而整个页面是处于浏览器的中间，浏览器的宽度是可以随时调整的。 +比如说，网站左上角的logo，设计图给出的左边距是143像素，此时，我们千万不要以为，logo的左边距真的是143像素。因为设计图只是一个版心；而整个页面是处于浏览器的中间，浏览器的宽度是可以随时调整的。 我们量一下中间四个方形图的width，是1000px，所以，网页版心的宽度是1000px。 diff --git a/03-JavaScript基础/08-数组.md b/03-JavaScript基础/08-数组.md index 5862efe..b88a53f 100644 --- a/03-JavaScript基础/08-数组.md +++ b/03-JavaScript基础/08-数组.md @@ -480,7 +480,7 @@ PS：这几个方法**不会修改原数组**。 var array = [1,2,3,4,5,6]; array.splice(0); //方式1：删除数组中所有项目 - array.length = 0; //方式1：length属性可以赋值，在其它语言中length是只读 + array.length = 0; //方式2：length属性可以赋值，在其它语言中length是只读 array = []; //方式3：推荐 ``` diff --git a/03-JavaScript基础/10-DOM操作.md b/03-JavaScript基础/10-DOM操作.md index f176364..29d0498 100644 --- a/03-JavaScript基础/10-DOM操作.md +++ b/03-JavaScript基础/10-DOM操作.md @@ -78,7 +78,7 @@ JavaScript基础分为三个部分： ```javascript var div1 = document.getElementById("box1"); //方式一：通过id获取单个标签 - var arr1 = document.getElementsByTagName("div1"); //方式二：通过 标签名 获得 标签数组，所以有s + var arr1 = document.getElementsByTagName("div"); //方式二：通过 标签名 获得 标签数组，所以有s var arr2 = document.getElementsByClassName("hehe"); //方式三：通过 类名 获得 标签数组，所以有s ``` @@ -161,7 +161,7 @@ JavaScript基础分为三个部分： div1.onclick = function () { div1.style.width = "200px"; //属性值要写引号 div1.style.height = "200px"; - div1.style.backgroundColor = "red"; //属性名是backgroundColor，不是background-Color + div1.style.backgroundColor = "red"; //属性名是backgroundColor，不是background-color } ``` @@ -169,7 +169,7 @@ JavaScript基础分为三个部分： 上方代码的注意事项： - 在js里写属性值时，要用引号 -- 在js里写属性名时，是`backgroundColor`，不是CSS里面的`background-Color`。 +- 在js里写属性名时，是`backgroundColor`，不是CSS里面的`background-color`。 实现效果如下： @@ -375,7 +375,7 @@ DOM节点的获取方式其实就是**获取事件源的方式**，在上一段 ```javascript var div1 = document.getElementById("box1"); //方式一：通过id获取单个标签 - var arr1 = document.getElementsByTagName("div1"); //方式二：通过 标签名 获得 标签数组，所以有s + var arr1 = document.getElementsByTagName("div"); //方式二：通过 标签名 获得 标签数组，所以有s var arr2 = document.getElementsByClassName("hehe"); //方式三：通过 类名 获得 标签数组，所以有s ``` diff --git a/03-JavaScript基础/13-BOM的常见内置方法和内置对象.md b/03-JavaScript基础/13-BOM的常见内置方法和内置对象.md index 2c11cd4..8fd5054 100644 --- a/03-JavaScript基础/13-BOM的常见内置方法和内置对象.md +++ b/03-JavaScript基础/13-BOM的常见内置方法和内置对象.md @@ -75,7 +75,7 @@ BOM：Browser Object Model，浏览器对象模型。 - name：新窗口的名称，可以为空 -- featurse：属性控制字符串，在此控制窗口的各种属性，属性之间以逗号隔开。 +- features：属性控制字符串，在此控制窗口的各种属性，属性之间以逗号隔开。 - fullscreen= { yes/no/1/0 } 是否全屏，默认no diff --git a/03-JavaScript基础/14-原型链.md b/03-JavaScript基础/14-原型链.md index 21a82d1..3b86f2b 100644 --- a/03-JavaScript基础/14-原型链.md +++ b/03-JavaScript基础/14-原型链.md @@ -73,14 +73,14 @@ ### 规则三 -所有的**函数**（不包括数组、对象），都有一个`protype`属性，属性值是一个**普通的对象**。`protype`的含义是**显式原型**。（实例没有这个属性） +所有的**函数**（不包括数组、对象），都有一个`prototype`属性，属性值是一个**普通的对象**。`prototype`的含义是**显式原型**。（实例没有这个属性） ![](http://img.smyhvae.com/20180306_1659.png) ### 规则四 -所有的**引用类型**（数组、对象、函数），`_proto_`属性指向它的**构造函数**的`protype`值。 +所有的**引用类型**（数组、对象、函数），`_proto_`属性指向它的**构造函数**的`prototype`值。 ![](http://img.smyhvae.com/20180306_1701.png) @@ -88,7 +88,7 @@ ### 规则五 -当试图获取一个对象的某个属性时，如果这个对象本身没有这个属性，那么会去它的`_proto_`中寻找（即它的构造函数的`protype`）。 +当试图获取一个对象的某个属性时，如果这个对象本身没有这个属性，那么会去它的`_proto_`中寻找（即它的构造函数的`prototype`）。 `举例代码1`： @@ -113,7 +113,7 @@ fn.alertName(); //输出结果：smyhvae ``` -上方代码中，虽然 alertName 不是 fn 自身的属性，但是会从它的构造函数的`protype`里面找。 +上方代码中，虽然 alertName 不是 fn 自身的属性，但是会从它的构造函数的`prototype`里面找。 **扩展：**遍历循环对象自身的属性 @@ -136,7 +136,7 @@ 还是拿上面的``举例代码1``举例，如果此时在最后面加一行代码： ``` - fn.toString(); //去 fn._proto_._proto 中查找 toString()方法 + fn.toString(); //去 fn._proto_._proto_ 中查找 toString()方法 ``` 上面的代码中，fn直接调用了 toString()方法，这是因为它通过**原型链**，去`_proto_`的`_proto_`里找到了`Object`，而`Object`是由`toString()`方法的。 diff --git a/03-JavaScript进阶/06-作用域和闭包.md b/03-JavaScript进阶/06-作用域和闭包.md index ab3f879..a4f703e 100644 --- a/03-JavaScript进阶/06-作用域和闭包.md +++ b/03-JavaScript进阶/06-作用域和闭包.md @@ -579,7 +579,7 @@ PS：还有一个条件是**外部函数被调用，内部函数被声明**。 - 问题1. 函数执行完后, 函数内部声明的局部变量是否还存在? -答案：一般是不存在, 存在于闭中的变量才可能存在。 +答案：一般是不存在, 存在于闭包中的变量才可能存在。 闭包能够一直存在的根本原因是`f`，因为`f`接收了`fn1()`，这个是闭包，闭包里有a。注意，此时，fn2并不存在了，但是里面的对象（即闭包）依然存在，因为用`f`接收了。 diff --git a/04-前端基本功：CSS和DOM练习/03-DOM操作练习：基础练习.md b/04-前端基本功：CSS和DOM练习/03-DOM操作练习：基础练习.md index 6ed6e50..5a5ab26 100644 --- a/04-前端基本功：CSS和DOM练习/03-DOM操作练习：基础练习.md +++ b/04-前端基本功：CSS和DOM练习/03-DOM操作练习：基础练习.md @@ -205,7 +205,7 @@ img.src = this.href; //this指的是函数调用者，和i并无关系，所以不会出错。 // img.src = aArr[i].href; 注意，上面这一行代码不要写成这样 des.innerHTML = this.title; - return false; //retrun false表示：阻止继续执行下面的代码。 + return false; //return false表示：阻止继续执行下面的代码。 } } @@ -222,7 +222,7 @@ （3）【重要】书写事件驱动程序：这里是用`img.src = this.href`，而不是用`img.src = aArr[i].href`。因为this指的是函数的调用者。如果写成后者，等i变成了4，就会一直是4。显然不能达到效果。 -（4）代码的最后一行：`retrun false`表示：阻止继续执行下面的代码。 +（4）代码的最后一行：`return false`表示：阻止继续执行下面的代码。 实现的效果如下： diff --git a/05-jQuery/02-jQuery动画详解.md b/05-jQuery/02-jQuery动画详解.md index 7f564bb..6ae7dfc 100644 --- a/05-jQuery/02-jQuery动画详解.md +++ b/05-jQuery/02-jQuery动画详解.md @@ -514,7 +514,7 @@ PS：参数如果都不写，默认两个都是false。实际工作中，直接 如果参数jumpToEnd被设置为true，那么当前动画会停止，但是参与动画的每一个CSS属性将被立即设置为它们的目标值。比如：slideUp()方法，那么元素会立即隐藏掉。如果存在回调函数，那么回调函数也会立即执行。 -注意：如果元素动画还没有执行完，此时调用sotp()方法，那么动画将会停止。并且动画没有执行完成，那么回调函数也不会被执行。 +注意：如果元素动画还没有执行完，此时调用stop()方法，那么动画将会停止。并且动画没有执行完成，那么回调函数也不会被执行。 ## 举例：右下角的弹出广告 diff --git a/05-jQuery/04-jQuery的事件机制和其他知识.md b/05-jQuery/04-jQuery的事件机制和其他知识.md index 58fca99..be037d4 100644 --- a/05-jQuery/04-jQuery的事件机制和其他知识.md +++ b/05-jQuery/04-jQuery的事件机制和其他知识.md @@ -235,7 +235,7 @@ $(selector).off("click"); // 解绑匹配元素的所有click事件 - $(selector).off( “click”, "**" ); // 解绑所有代理的click事件，元素本身的事件不会被解绑 + $(selector).off( "click", "**" ); // 解绑所有代理的click事件，元素本身的事件不会被解绑 ``` ## jQuery的事件对象 diff --git a/06-HTML5和CSS3/03-CSS3选择器详解.md b/06-HTML5和CSS3/03-CSS3选择器详解.md index b275584..71549bc 100644 --- a/06-HTML5和CSS3/03-CSS3选择器详解.md +++ b/06-HTML5和CSS3/03-CSS3选择器详解.md @@ -61,7 +61,7 @@ CSS参考手册的下载链接：