随笔分类 - teach
摘要：常见class关键词： 布局类：header, footer, container, main, content, aside, page, section 包裹类：wrap, inner 区块类：region, block, box 结构类：hd, bd, ft, top, bottom, lef
阅读全文
摘要：这里分享下JS实现的九宫格抽奖案例，首先说明该版本抽奖过程中均为匀速转动。 具体步骤和原理十分简单，详解代码即可 代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" cont
阅读全文
摘要：问题：在用 cnpm 命令的时候，突然出现无响应的情况（光标一直在闪，但是没任何反应） 解决步骤：（1）删除 .npmrc 文件全局搜索 .npmrc 文件并删除（建议先备份文件） 注意.npmrc位置一般在C:\Users\Administrator下 （2）重装 cnpm 命令 npm inst
阅读全文
摘要：打开visual studio code 创建.php文件时弹出如下提示框 1、点击打开设置 2、点击在settings.json中编辑 3、在引号内输入php安装目录/php.exe .
阅读全文
摘要：这里我们介绍个新的浏览器截图小技巧，可以快速截取某个元素区域的截图，案例如下 1、打开控制台选中元素 2、Ctrl+Shift+P 输入node，选中第一个“捕获屏幕快照” 点击后即可下载，如下 .
阅读全文
摘要：Emmet的所有操作按下“tab”键即可瞬间完成 元素 1.在编辑器中输入元素名称，即可自动补全生成 HTML 标签，即使不是标准的 HTML 标签。 2.输入：! 或者 html:5 或者 html:4s 或者 html:4t 将自动补全html基本结构 嵌套操作 1.使用“>”生成子元素 1 /
阅读全文
摘要：概述 这篇文章是基于网易的移动端屏幕适配方案而来的。 （1）思考 在移动端开发中，对于页面屏幕适配要解决哪些问题？ 对于不同的dpr，图片会有模糊的情况，怎么适配？ 对于不同的屏幕宽度，怎么适配？ 对于不同的内容：容器，文字和图片，怎么适配？ 对于移动适配，我个人希望达到的效果是，对于不同的屏幕，在
阅读全文
摘要：flexible.js (750px) 实现步骤： 1：先去掉禁止用户缩放的meta标签 2：在页面中导入flexible.js <script src=""></script> 3:量出header的height为88px 4:88px / 100 == 0.88rem;
阅读全文
摘要：上一回说到了媒体查询结合rem做移动端布局，步骤如下 首先设置媒体查询，确定html中font-size值的变化 @media all and (max-width:320px){ html{font-size:12px;} } @media all and (min-width:321px) an
阅读全文
摘要：第一步：先写好重置的样式。直接复制粘贴即可 @media all and (max-width: 320px){ html{ font-size: 12px; } } @media all and (min-width: 321px) and (max-width: 375px){ html{ fo
阅读全文
摘要：页面的渲染过程 当我们在浏览器里输入一个 URL 后，最终会呈现一个完整的网页。会经历以下几个步骤： 1、HTML 的加载 页面上输入 URL 后，会先拿到 HTML 文件。HTML是一个页面的基础，所以会在最开始的时候下载它，下载完毕后就开始对它进行解析 2、其他静态资源的下载 HTML 在解析的
阅读全文
摘要：部分看了文章的设计师，来找我说怎么切图。sorry？在我的理解，这就是切图啊，但是他们所指的“切图”是，怎么把设计图制作成html页面。 在我看来，现在人们对于前端都是有误区的。认为前端是切图的，（也确实是这么叫的，本人情感上很不愿意听前端被叫做“切图的”）所以也会误认为我的这篇文章是写给设计师的。
阅读全文
摘要：为方便起见，为所有支持的请求方法提供了别名 在使用别名方法时， url、method、data 这些属性都不必在配置中指定 axios.request(config) axios.get(url[, config]) axios.delete(url[, config]) axios.head(ur
阅读全文
摘要：前言： 除了component，微信小程序中还有另一种组件化你的方式template模板，这两者之间的区别是，template主要是展示，方法则需要在调用的页面中定义。而component组件则有自己的业务逻辑，可以看做一个独立的page页面。简单来说，如果只是展示，使用template就足够了，如
阅读全文
摘要：前言 有过面试经验的同学应该都被问过浏览器兼容性的问题，对于面试官的问题，常常猝不及防，因为通常他们都是这么问的。"来谈谈浏览器兼容的问题吧"，"你对浏览器的兼容性有了解过吗"，那么如何才是我们正确回答这个问题的姿势呢。 虽然面试官的问题十分的笼统，浏览器的兼容性无非还是样式兼容性（css），交互兼
阅读全文
摘要：（1）整体配置 entry：配置入口文件的地址，可以是单一入口，也可以是多入口。 output：配置出口文件的地址，在webpack2.X版本后，支持多出口配置。 module：配置模块，主要是解析CSS和图片转换压缩等功能。 plugins：配置插件，根据你的需要配置不同功能的插件。 devSer
阅读全文
摘要：注意： 1、在webpack里，所有文件都是模块 例如：JS模块 >模块化(AMD、CMD、ES6 Module、Commonjs) 关于模块化参见https://www.cnblogs.com/jianxian/p/12753375.html. 如下所示 接下来便可以导入使用 最后做下验证输出，可
阅读全文
摘要：前端模块化 模块化开发可以提高代码复用率，方便代码管理。一般来说一个文件就是一个模块，得外暴露变量或者函数。目前比较流行的模块化的规范有：AMD、CMD和CommonJs以及ES6 的 module。 AMD（Asynchronous Module Definition）CMD（Common Mod
阅读全文
