CSS 系列文章——CSS 中的流与尺寸

2020-08-27

一、流与宽度

1、一个水平流上只能单独显示一个元素，多个块级元素换行显示

2、外部尺寸与流体特性

阅读全文

CSS 系列文章 —— 内联元素与流

2020-08-27

一、x-height

1、是什么: 指小写字母 x 的高度，术语描述就是基线和等分线(mean line)(也称作中线，midline)之间的距离

阅读全文

CSS 系列文章——CSS 基础知多少

2020-08-27

一、CSS 是怎么组织的

先看一段 demo：

.icon {
  width: 20px;
  height: 30px;
  border-radius: 4px;
}

阅读全文

CSS 系列文章——CSS历史及文档流

2020-08-27

一、CSS 简史

1、1994 年被提议

2、1996 年 W3C 正式推出 CSS1

3、1998 年 W3C 正式推出 CSS2，推行内容和表现分离，table 布局开始没落

阅读全文

科普

2020-08-13

1、西北太平洋生成的热带气旋叫做”台风”（typhoon），其他海域生成的叫做”飓风”（hurricane）

2、通常情况下，经济增长一定伴随资源消耗的增长和自然环境的压力。一旦经济进入成熟阶段以后，增长可能会带来资源消耗的减少。

3、非暴力交流

阅读全文

一些概念

2020-08-13

不要构建系统，而要构建子系统

这就像 Unix 哲学：每个工具做好一件事，不同的工具协同工作。

阅读全文

美句摘抄

2020-08-13

新海诚电影的诗意

  • 樱花落下的速度是每秒五厘米， 我该用怎么样的速度，才能与你相遇。——秒速五厘米

阅读全文

数字精确到小数点两位

2020-08-12

分析

对 js 有一定了解的人都知道，js 的数字精确度比较低，这就有必要自己去实现一套精确度高的算法了，精确到小数点后几位，是我们经常会用到的，比如价格的计算等，下面来讲讲这个算法的步骤

阅读全文

计算电饭煲的预约时间

2020-08-12

首先要确定预约的时间是指什么，是开始的时间，还是煮好之后的时间，如果是煮好之后的时间，就要在时间差的基础上减去煮好所需的时间，否则就是当前时间和期望时间的差。

demo

function formatTime(timeStamp) {
  const date = new Date(timeStamp);
  const day = [
    date.getFullYear(),
    date.getMonth() + 1,
    date.getDate(),
    date.getHours(),
    date.getMinutes(),
    date.getSeconds()
  ];
  return day;
}
// @param reservationTime:预约时间
// @param startTime：开始预约时间
// @param cookTime：需要煮的时长
function reservation({ reservationTime, startTime, cookTime }) {
  const date = new Date();
  const tomrrow = formatTime(date.getTime() + 24 * 60 * 60 * 1000);
  const tomrrowTime = `${tomrrow[0]}/${tomrrow[1]}/ ${tomrrow[2]}  ${reservationTime}`;
  const now = formatTime(date.getTime());
  const setTime = startTime
    ? `${now[0]}/${now[1]}/ ${now[2]}  ${startTime}`
    : date.getTime();
  const distance = new Date(tomrrowTime) - new Date(setTime) || date;
  const cook = cookTime.split(":");

  return [
    distance / 1000 / 60 / 60 + +cook[0],
    ((distance / 1000 / 60) % 60) + +cook[1],
    ((distance / 1000) % 60) + +cook[2]
  ];
}

const time = reservation({
  reservationTime: "6:30:00",
  // startTime: "23:30:00",
  cookTime: "01:10:00"
});
const res = `${Math.floor(time[0])}:${time[1].toFixed()}:${time[2].toFixed()}`;
console.log(res);

阅读全文

生成指定范围的随机数组

2020-08-12

输入范围，输出随机组成的数组，比如输入 minNum、maxNum、option，返回 minNum 与 maxNum 间的随机数组构成的 option 长度的数组。

思路

1、 求出随机数的范围 maxNum - minNum + 1

阅读全文