2021年6月7日
9个JavaScript单行代码
摘要： 9个JavaScript单行代码 1、随机获取布尔值 const randomBoolean = () => Math.random() >= 0.5; console.log(randomBoolean) Math.random()输出0-1之间的随机数，然后判断这个随机数是否大于等于0.5。 这 阅读全文
posted @ 2021-06-07 11:44 温少昌 阅读(97) 评论(0) 推荐(0) 编辑
5个css编码坏习惯
摘要： 今天我要分享的是我总结编码坏习惯。希望你在编写css时，可以扬长避短，一些顺利。 1、先给所有元素定义相同的属性，然后重置其中之一。 关于这个如何设置一些属性再重新设置的问题，让我觉得很纳闷，因为我本身比较倾向与使用简短的css。 在元素之间设置边距时很容易出现问题。这个时候太多数人会怎么做呢？首先 阅读全文
posted @ 2021-06-07 10:06 温少昌 阅读(67) 评论(0) 推荐(0) 编辑
2021年6月3日
Flex布局-实例
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-06-03 15:33 温少昌 阅读(147) 评论(0) 推荐(0) 编辑
Flex布局-语法篇
摘要： http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html Flex布局教程：语法篇 网页布局是css的一个重点应用 布局的传统解决方案，基于盒状模型，依赖display属性 + position属性 + float属性。它对于那些特殊布局非常不 阅读全文
posted @ 2021-06-03 11:38 温少昌 阅读(79) 评论(0) 推荐(0) 编辑
2021年5月31日
css grid布局
摘要： css-grid foo 1 2 3 4 5 6 7 8 9 bar flex是轴线布局，称为一维布局；grid则是将容器划分为行和列，产生单元格，然后指定项目所在的单元格，可以看做是二维布局。 <!DOCTYPE html> <html lang="en"> <head> <meta charse 阅读全文
posted @ 2021-05-31 16:33 温少昌 阅读(96) 评论(0) 推荐(0) 编辑
js 方法的一些简写和技巧
摘要： js代码技巧 1、数组去重 正常我们实现数组去重大多都是通过双层遍历或者indexOf的方式。 简单方式：利用Array.from与set去重。 Array.from(new Set(arr)) [...new Set(arr)] 2、数组转化为对象（Array to Object） 大多用for 阅读全文
posted @ 2021-05-31 11:54 温少昌 阅读(209) 评论(0) 推荐(0) 编辑
2021年5月28日
css瀑布流
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-05-28 17:07 温少昌 阅读(81) 评论(0) 推荐(0) 编辑
js防抖和节流
摘要： 节流函数和防抖函数在日常开发中还是有很多地方用到，两个函数的目的都是为了控制函数被调用的频率。 例子： input触发键盘输入事件，将输入的内容发送到后台： function request(val){ console.log('request:' + val) } let inputEl = do 阅读全文
posted @ 2021-05-28 14:19 温少昌 阅读(98) 评论(0) 推荐(0) 编辑
js循环
摘要： js循环 数组遍历 for、forEach、for ...of 小结： 三者都是基本的由左到右遍历数组 forEach 无法跳出循环；for 和 for ..of 可以使用 break 或者 continue 跳过或中断。 for ...of 直接访问的是实际元素。for 遍历数组索引，forEac 阅读全文
posted @ 2021-05-28 10:01 温少昌 阅读(186) 评论(0) 推荐(0) 编辑
2021年5月25日
两行css代码实现居中元素
摘要： display: grid; /* 垂直居中 align-items: center; justify-content: center; */ /* 垂直居中 place-items: center;*/ /* 左上角 place-items: start; */ /* 右上角 place-item 阅读全文
posted @ 2021-05-25 09:22 温少昌 阅读(108) 评论(0) 推荐(0) 编辑