- 博客(11)
- 收藏
- 关注
RSS订阅原创 HTML标签语义和浏览器API
目录1 HTML标签语义2 DOM API2.1 导航类api2.2 修改类api2.3 DOM高级操作api2.4 事件api2.5 range api2.5.1 创建range的两种方式2.5.2 其他选区设置api2.5.3 其他api2.5.4 反转子节点3 CSSOM API3.1 scroll api3.1.1 元素滚动3.1.2 窗口滚动3.2 layout api4 其它API 1 HTML标签语义 strong标签表示一个词在整个文章中的重要性，并不会改变语义； em标签表示一个词在句
2020-08-23 22:10:34
236
原创 webpack高级用法（1）：自动清理构建目录、多页面应用打包
目录1 自动清理构建目录1.1 插件安装1.2 配置2 自动补齐CSS3前缀2.1 插件安装2.2 配置3 移动端CSS px自动转换为rem3.1 插件安装3.2 配置3.3 配置4 资源内联 1 自动清理构建目录 避免每次构建前需要手动删除dist，使用clean-webpack-plugin，默认会删除 output 指定的输出目录 1.1 插件安装 npm i clean-webpack-plugin -D 1.2 配置 ... const {CleanWebpackPlugin} = req
2020-08-19 22:18:38
518
原创 webpack基础用法（4）：文件指纹策略和压缩
目录1 文件指纹策略1.1 JS的文件指纹设置1.2 CSS的文件指纹设置1.2.1 安装插件1.2.2 配置1.3 图片的文件指纹设置2 代码压缩2.1 JS压缩2.2 CSS压缩2.2.1 安装依赖2.2.2 配置2.3 html文件压缩2.3.1 安装依赖2.3.2 配置 1 文件指纹策略 文件指纹是指打包后输出的文件名的后缀 指纹策略： Hash：和整个项目的构建相关，只要项目文件有修改，整个项目构建的hash值就会更改 Chunkhash：和 webpack 打包的 chunk 有关， 不同的
2020-08-17 22:39:34
556
原创 webpack基础用法（3）：文件监听及热更新
目录1 文件监听1.1 配置方式1.2 监听原理2 浏览器热更新2.1 使用`webpack-dev-server` 配合 `HotModuleReplacementPlugin`2.1.1 安装依赖2.1.2 在`package.json`中的`scripts`中加入如下配置2.1.3 在`webpack.config.js`中加入如下配置2.2 使用`webpack-dev-middleware`2.2.1 安装依赖2.2.2 `server.js`2.2.3 在`package.json`中的`scr
2020-08-17 20:13:21
680
原创 webpack基础用法（2）：loaders
目录1 解析ES6和React JSX，babel-loader1.1 安装依赖1.2 配置 .babelrc 文件1.3 配置 webpack.config.js 文件2 解析CSS2.1 依赖安装2.2 配置 webpack.config.js 文件3 解析Less3.1 依赖安装3.2 配置 webpack.config.js 文件4 解析图片和字体4.1 解析图片4.1.1 依赖安装4.1.2 配置 webpack.config.js 文件4.2 解析字体4.2.1 依赖安装4.2.2 配置 web
2020-08-17 18:12:31
340
原创 重学CSS（2）
目录1 CSS排版1.1 盒1.2 正常流1.2.1 正常流的行级排布 1 CSS排版 1.1 盒 box-sizing： content-box，width只包含content的宽度 border-box，width包含了border和padding的宽度 1.2 正常流 收集盒（和文字）进行 计算盒在行中的排布 计算行的排布 1.2.1 正常流的行级排布 ...
2020-08-10 10:12:00
92
原创 webpack基础用法（1）：核心概念
目录1 核心概念：entry2 核心概念：output3 核心概念：loaders4 核心概念：plugins5 核心概念：mode 1 核心概念：entry entry 用来指定 webpack 的打包入口 //单入口：entry是一个字符串 module.exports = { enter: './src/index.js' } //多入口：entry是一个对象 module.exports = { enter: { index: './src/index.js', searc
2020-08-04 18:49:12
144
原创 重学CSS（1）
目录1. CSS@规则2. CSS规则的结构3. CSS选择器3.1 选择器语法3.2 选择器的优先级3.3 伪类3.4 伪元素 1. CSS@规则 @charset @import @media @page：打印机相关 @counter-style @keyframes：https://www.w3.org/TR/css-animations-1/ @fontface：https://www.w3.org/TR/css-fonts-3/ @supports：不推荐使用该规则检测浏览器css兼容性 @na
2020-08-03 11:49:37
134
原创 浏览器工作原理，动手码一个简易浏览器（3）：元素布局（layout）和渲染（render）
简易浏览器，元素布局（layout）和渲染（render）
2020-07-31 16:55:16
363
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人