From bbf68d3848f7f2ec8068557a68064819b2ab559b Mon Sep 17 00:00:00 2001 From: qianguyihao Date: Sat, 23 Nov 2019 11:16:39 +0800 Subject: [PATCH] update: css --- 02-CSS基础/01-CSS属性：字体属性和文本属性.md | 3 -- 03-CSS进阶/CSS开发积累.md | 18 +++++++++++ .../15-数组的常见方法&数组的遍历.md | 23 ++++++++++---- 05-JavaScript进阶/JavaScript开发积累.md | 21 +++++++++---- 17-前端综合/2019年-前端日记.md | 30 ------------------- 18-推荐链接/01-2019年Web前端最新导航.md | 4 +++ 18-推荐链接/02-GitHub项目推荐.md | 1 + 7 files changed, 56 insertions(+), 44 deletions(-) diff --git a/02-CSS基础/01-CSS属性：字体属性和文本属性.md b/02-CSS基础/01-CSS属性：字体属性和文本属性.md index 2772bb1..5e5d116 100644 --- a/02-CSS基础/01-CSS属性：字体属性和文本属性.md +++ b/02-CSS基础/01-CSS属性：字体属性和文本属性.md @@ -1,7 +1,4 @@ -> 本文最初于2015-10-04发表于[博客园](http://www.cnblogs.com/smyhvae/p/4855106.html)，并在[GitHub](https://github.com/qianguyihao/Web)上持续更新**前端的系列文章**。欢迎在GitHub上关注我，一起入门和进阶前端。 - -> 以下是正文。 ## 本文重要内容 diff --git a/03-CSS进阶/CSS开发积累.md b/03-CSS进阶/CSS开发积累.md index c4a3c59..431229f 100644 --- a/03-CSS进阶/CSS开发积累.md +++ b/03-CSS进阶/CSS开发积累.md @@ -33,3 +33,21 @@ CSS的逗号一般写在()里。**不同属性值之间，用的是空格**， ``` +### 2019-11-01 + +价格中的羊角符号，有半角和全角之分： + +- ¥半角 + +- ￥全角 + +可以看出，半角的宽度更小。考虑到容器的空间一般比较紧张，所以推荐使用**半角**。 + + + + + +### 2019-11-19-鼠标悬停时，弹出提示文字 + +参考链接：[css实现鼠标悬浮后的提示效果](https://www.cnblogs.com/zhaojian-08/p/10074660.html) + diff --git a/04-JavaScript基础/15-数组的常见方法&数组的遍历.md b/04-JavaScript基础/15-数组的常见方法&数组的遍历.md index 830f849..10c2c5a 100644 --- a/04-JavaScript基础/15-数组的常见方法&数组的遍历.md +++ b/04-JavaScript基础/15-数组的常见方法&数组的遍历.md @@ -624,26 +624,39 @@ obj:王一,王二,王三 ![](http://img.smyhvae.com/20180402_0938.png) -**举例2**：【重要案例】 +**举例2**：【重要案例，实际开发中经常用到】 将A数组中某个属性的值，存储到B数组中。代码举例： ```javascript const arr1 = [ - { name: '千古壹号', age: '28' }, { name: '许嵩', age: '32' } + { name: '千古壹号', age: '28' }, + { name: '许嵩', age: '32' }, ]; - const arr2 = arr1.map(item => item.name); // 将数组 arr1 中的 name 属性，存储到 数组 arr2 中 + + // 将数组 arr1 中的 name 属性，存储到 数组 arr2 中 + const arr2 = arr1.map(item => item.name); + + // 将数组 arr1 中的 name、age这两个属性，改一下“键”的名字，存储到 arr3中 + const arr3 = arr1.map(item => ({ + myName: item.name, + myAge: item.age, + })); // 将数组 arr1 中的 name 属性，存储到 数组 arr2 中 console.log('arr1:' + JSON.stringify(arr1)); console.log('arr2:' + JSON.stringify(arr2)); + console.log('arr3:' + JSON.stringify(arr3)); + ``` 打印结果： ``` - arr1:[{"name":"千古壹号","age":"28"},{"name":"许嵩","age":"32"}] +arr1:[{"name":"千古壹号","age":"28"},{"name":"许嵩","age":"32"}] - arr2:["千古壹号","许嵩"] +arr2:["千古壹号","许嵩"] + +arr3:[{"myName":"千古壹号","myAge":"28"},{"myName":"许嵩","myAge":"32"}] ``` diff --git a/05-JavaScript进阶/JavaScript开发积累.md b/05-JavaScript进阶/JavaScript开发积累.md index c17017e..91b7abb 100644 --- a/05-JavaScript进阶/JavaScript开发积累.md +++ b/05-JavaScript进阶/JavaScript开发积累.md @@ -22,12 +22,6 @@ function getFirstNode(ele){ ``` - - - - - - ### 断点调试 （1）先让程序运行一遍。 @@ -58,6 +52,21 @@ function getFirstNode(ele){ +### 2019-05-20-给数组、对象赋值 + +**数组赋值的正确写法**： + +```javascript +this.todayList.splice(0, 0, ...dataList); +``` + +**对象赋值的正确写法**： + +```javascript +Object.assign(this.dataObj, dataObj); +``` + +上方代码中，是将`dataObj` 的值追加到`this.dataObj`中。如果对象里属性名相同，会被覆盖。 diff --git a/17-前端综合/2019年-前端日记.md b/17-前端综合/2019年-前端日记.md index ce49571..b3a9c9c 100644 --- a/17-前端综合/2019年-前端日记.md +++ b/17-前端综合/2019年-前端日记.md @@ -81,24 +81,6 @@ Vue的全局变量空间：`this.$root.data`，我们可以在这里面存放数 - css 动画实现闪烁效果： - -### 2019-05-20 - -**数组赋值的正确写法**： - -```javascript -this.todayList.splice(0, 0, ...dataList); -``` - -**对象赋值的正确写法**： - -```javascript -Object.assign(this.dataObj, dataObj); -``` - -上方代码中，是将`dataObj` 的值追加到`this.dataObj`中。如果对象里属性名相同，会被覆盖。 - - ### 2019-05-20-css3动画水平/镜像翻转 参考链接1： @@ -264,16 +246,4 @@ css部分：（重点是 background 属性的写法） 使用hover为div添加边框时，页面布局发生错位的解决办法：https://blog.csdn.net/u014033756/article/details/51049574 -### 2019-11-01 - -价格中的羊角符号，有半角和全角之分： - -- ¥半角 - -- ￥全角 - -可以看出，半角的宽度更小，推荐使用。 - - - diff --git a/18-推荐链接/01-2019年Web前端最新导航.md b/18-推荐链接/01-2019年Web前端最新导航.md index 9736e2e..9a51e92 100644 --- a/18-推荐链接/01-2019年Web前端最新导航.md +++ b/18-推荐链接/01-2019年Web前端最新导航.md @@ -258,6 +258,10 @@ Sass 是成熟、稳定、强大的 CSS 扩展语言。入门文档可以看：< - iconninja： +## 设计素材 + +- 设优 SHEUI： + ## 工具 diff --git a/18-推荐链接/02-GitHub项目推荐.md b/18-推荐链接/02-GitHub项目推荐.md index c6d6f2b..96ff677 100644 --- a/18-推荐链接/02-GitHub项目推荐.md +++ b/18-推荐链接/02-GitHub项目推荐.md @@ -28,6 +28,7 @@ - 反向面试（反问面试官的问题）： +- 掘金前端面试题合集： ## 博客