11 2021 档案
3分钟理解BFC
摘要:BFC的简介 BFC(Block Formatting Context) 块级格式化上下文,是用于布局块级盒子的一块渲染区域。 MDN上的解释:BFC是Web页面 CSS 视觉渲染的一部分,用于决定块盒子的布局及浮动相互影响范围的一个区域。 一个BFC的范围包含创建该上下文元素的所有子元素,但不包括
深入理解javascript原型和原型链
摘要:构造函数 通过 new 函数名 来实例化对象的函数叫构造函数。 任何的函数都可以作为构造函数存在。之所以有构造函数与普通函数之分,主要从功能上进行区别的,构造函数的主要 功能为 初始化对象,特点是和new 一起使用。new就是在创建对象,从无到有,构造函数就是在为初始化的对象添加属性和方法。构造函数
实现三栏布局的8种方式
摘要:三栏布局:两侧宽度固定,中间宽度自适应的 公共样式 * { padding: 0; margin: 0; height: 100%; } .left { width: 200px; background-color: aqua; } .right { width: 200px; background
js实现放大镜
摘要:效果图 实现原理 借助宽高等比例放大的两张图片,结合js中鼠标偏移量、元素偏移量、元素自身宽高等属性完成; 左侧遮罩移动Xpx,右侧大图移动X*倍数px;其余部分就是用小学数学算一下就OK了。 完整事例 <!DOCTYPE html> <html lang="en"> <head> <meta ch
DOM 对象和 BOM 对象
摘要:DOM对象 1. DOM 简介 DOM (Document Object Model)是 W3C 的标准,是指文档对象模型(树结构)。 DOM 定义了访问和操作 HTML 文档的标准方法。通过它,可以访问HTML文档的所有元素。 2. HTML DOM 树 3. DOM 节点 根据 W3C 的 HT
非常实用的在线工具网站清单
摘要:🎉 在线图片压缩 传送门:tinypng.com 在线图片压缩网站已经优化超过十亿张图片,支持WebP,PNG,JPEG等格式的图片的压缩。 TinyPNG使用智能有损压缩技术来减小WEBP、JPEG和PNG文件的文件大小。通过有选择地减少图像中的颜色数量,存储数据所需的字节更少。这种效果几乎是看
React17 生命周期
摘要:在17版本中 废除的生命周期有:componentWillMount,componentwillReceiveProps,componentWillUpdate 新增的生命周期有:getDerivedStateFromProps(nextProps, prevState) . 生命周期顺序 Moun
React17 入门
摘要:查看 demo ref <div ref = {( box )=>{ this.box = box }}></div> console.log(this.box); // 获取dom 生命周期(针对于组件而言) Mounting 挂载顺序 constructor(props):初始化 state 和
Vue3 script setup 语法糖,超爽体验
摘要:简介 <script setup> 语法糖并不是新增的功能模块,它只是简化了以往的组合API(compositionApi)的必须返回(return)的写法,并且有更好的运行时性能。 在 setup 函数中:所有 ES 模块导出都被认为是暴露给上下文的值,并包含在 setup() 返回对象中。相对于