LinDaiDai
diff --git a/‎2020面试系列/每日一题-CSS篇.md
Lines changed: 38 additions & 6 deletions b/‎2020面试系列/每日一题-CSS篇.md
Lines changed: 38 additions & 6 deletions
diff --git a/‎DD每周七题/codes/test.html
Lines changed: 0 additions & 32 deletions b/‎DD每周七题/codes/test.html
Lines changed: 0 additions & 32 deletions
diff --git a/‎DD每周前端七题详解/DD每周前端七题详解-第二期.md
Lines changed: 5 additions & 3 deletions b/‎DD每周前端七题详解/DD每周前端七题详解-第二期.md
Lines changed: 5 additions & 3 deletions
diff --git a/‎DD每周前端七题详解/DD每周前端七题详解-第五期.md
Lines changed: 49 additions & 0 deletions b/‎DD每周前端七题详解/DD每周前端七题详解-第五期.md
Lines changed: 49 additions & 0 deletions
@@ -256,7 +256,7 @@ BFC全称 Block Formatting Context 即`块级格式上下文`，简单的说，B
 }
 ```
 
-图片5
+![](https://user-gold-cdn.xitu.io/2020/6/7/1728f5c2724a713f?w=302&h=192&f=jpeg&s=15299)
 
 设置了`vertial-align: top;`后：
 
@@ -270,13 +270,45 @@ BFC全称 Block Formatting Context 即`块级格式上下文`，简单的说，B
 }
 ```
 
-图片6
+![](https://user-gold-cdn.xitu.io/2020/6/7/1728f5c467fb3e50?w=296&h=186&f=jpeg&s=13657)
 
 
 
 ### 如何解决inline-block空白问题？
 
-- **删除html中的空白**：不要让元素之间换行：
+原本的代码为：
+
+```html
+<style>
+.sub {
+  background: hotpink;
+  display: inline-block;
+}
+</style>
+<body>
+  <div class="super">
+    <div class="sub">
+      孩子
+    </div>
+    <div class="sub">
+      孩子
+    </div>
+    <div class="sub">
+      孩子
+    </div>
+  </div>
+</body>
+```
+
+效果为：
+
+图片1
+
+可以看到每个`孩子`之间都会有一个空白。`inline-block`元素间有空格或是换行，因此产生了间隙。
+
+解决办法：
+
+- **(1) 删除html中的空白**：不要让元素之间换行：
 
   ```html
   <div class="super">
@@ -290,7 +322,7 @@ BFC全称 Block Formatting Context 即`块级格式上下文`，简单的说，B
   </div>
   ```
 
-- **设置负的边距**：你可以用负边距来补齐空白。但你需要调整`font-size`，因为空白的宽度与这个属性有关系。例如下面这个例子：
+- **(2) 设置负的边距**：你可以用负边距来补齐空白。但你需要调整`font-size`，因为空白的宽度与这个属性有关系。例如下面这个例子：
 
   ```css
   .sub {
@@ -301,9 +333,9 @@ BFC全称 Block Formatting Context 即`块级格式上下文`，简单的说，B
   }
   ```
 
-- **给父级设置font-size: 0**：不管空白多大，由于空白跟font-size的关系，设置这个属性即可把空白的宽度设置为0。但是如果你的子级有字的话，也得单独给子级设置字体大小。
+- **(3) 给父级设置font-size: 0**：不管空白多大，由于空白跟`font-size`的关系，设置这个属性即可把空白的宽度设置为0。但是如果你的子级有字的话，也得单独给子级设置字体大小。
 
-- **注释**：
+- **(4) 注释**：
 
   ```html
   <div class="super">
 
@@ -169,14 +169,14 @@ function getCookie(name) {
 
 - `box.onmousedown`
 - `document.onmousemove`
-- `box.onmouseup`
+- `document.onmouseup`
 
 3. 实现的事件顺序
 
 - 首先监听`box.onmousedown`，即鼠标按下`box`时触发的事件，记录下鼠标按下时距离屏幕上边和左边的距离，以及`box`距离屏幕上边和左边的距离，再用前者减去后者得到差值`distanceX`和`distanceY`
 - 然后在此事件中监听`document.onmousemove`事件，记录下每次鼠标移动时距离屏幕上边和左边的距离，然后用它们减去`distanceX`和`distanceY`，再将其赋值给`box`的`left`和`top`，使其能跟着鼠标移动
 - 不过需要考虑`box`距离屏幕最上面/下面/左边/右边的边界情况
-- 当`box.onmouseup`的时候需要将`document.onmousemove`事件设置为`null`
+- 当`document.onmouseup`的时候需要将`document.onmousemove`事件设置为`null`
 
 如图所示：
 
@@ -235,14 +235,16 @@ window.onload = function () {
       box.style.left = left + 'px';
       box.style.top = top + 'px';
     }
-    box.onmouseup = function () {
+    document.onmouseup = function () {
       document.onmousemove = null;
       box.onmouseup = null;
     }
   }
 }
 ```
 
+(感谢[Turbo328](https://github.com/Turbo328)指出使用`document.onmouseup`效果会比`box.onmouseup`好一些)
+
 [https://github.com/LinDaiDai/niubility-coding-js/issues/11](https://github.com/LinDaiDai/niubility-coding-js/issues/11)
 
 ### 五、如何阻止冒泡和默认事件(兼容写法)
 
@@ -0,0 +1,49 @@
+## DD每周前端七题详解-第五期
+
+## 系列介绍
+
+你盼世界，我盼望你无`bug`。Hello 大家好！我是霖呆呆！
+
+呆呆每周都会分享七道前端题给大家，系列名称就是「DD每周七题」。
+
+系列的形式主要是：`3道JavaScript` + `2道HTML` + `2道CSS`，帮助我们大家一起巩固前端基础。
+
+所有题目也都会整合至 [LinDaiDai/niubility-coding-js](https://github.com/LinDaiDai/niubility-coding-js/issues) 的`issues`中，欢迎大家提供更好的解题思路，谢谢大家😁。
+
+一起来看看本周的七道题吧。
+
+
+
+## 正题
+
+### 一、JS基础知识，++自增运算符
+
+(题目提供者：[sinnkirou](https://github.com/sinnkirou))
+
+```
+var a =10;
+var b = ++a;
+=> a=10; b=11
+
+a，b应该都是11
+```
+
+
+
+
+
+## 后语
+
+你盼世界，我盼望你无`bug`。这篇文章就介绍到这里。
+
+您每周也许会花`48`小时的时间在工作💻上，会花`49`小时的时间在睡觉😴上，也许还可以再花`20`分钟的时间在呆呆的7道题上，日积月累，我相信我们都能见证彼此的成长😊。
+
+什么？你问我为什么系列的名字叫`DD`？因为`呆呆`呀，哈哈😄。
+
+喜欢**霖呆呆**的小伙还希望可以关注霖呆呆的公众号 `LinDaiDai` 或者扫一扫下面的二维码👇👇👇。
+
+![](https://user-gold-cdn.xitu.io/2020/6/17/172c12220c3a29a1?w=900&h=500&f=gif&s=1632550)
+
+我会不定时的更新一些前端方面的知识内容以及自己的原创文章🎉
+
+你的鼓励就是我持续创作的主要动力 😊。