CSS Grid 布局是一种二维的布局系统，与 Flex 布局（Flexbox）仅关注一维（行或列）不同，Grid 能够同时处理行和列的布局，通过创建网格容器和网格项目，实现对网页元素的精确控制。它引入了一系列独特的术语，如网格线、轨道、单元格和网格区域，为开发者提供了强大且灵活的布局能力。 CSS…

在响应式设计成为标配的今天，CSS布局技术经历了从浮动（Float）到弹性盒子（Flexbox），再到网格（Grid）的演进过程。Flex 布局（Flexbox）作为一维布局解决方案，擅长处理单行或单列的弹性布局场景，例如导航栏、卡片列表等。但随着 Web 界面复杂度的提升，当需要处理二维布局（同时…

conic-gradient是 CSS 中用于创建锥形渐变效果的函数。与线性渐变（linear-gradient）和径向渐变（radial-gradient）不同，conic-gradient 是 CSS 中一种围绕中心点按角度方向渐变的颜色过渡效果，就像一个色轮一样。颜色从起始角度开始，沿顺时针方…

实现html页面动画的方式有很多种，而css3中的过渡属性transition`也是实现动画效果的高频工具。 transition 属性允许 CSS 的属性值在一定的时间区间内平滑地过渡。当元素的某个 CSS 属性值发生变化时，过渡效果可以避免属性值的突然改变，而是以动画的形式逐渐变化，从而增强用户…

Set 和 Map是 ES6 中引入的两种新的数据结构。提供了更强大和灵活的数据存储与操作方式。 Set Set是一种集合数据结构，它允许存储任何类型的唯一值，无论是基本数据类型还是对象引用。 特点： 唯一性：集合中的每个值都是唯一的，重复的值会被自动忽略。 无序性：Set中的元素没有特定的顺序，不…

1.replace 和 replaceAll replace()替换字符串中的部分内容，返回一个新字符串，原始的字符串不会改变。 语法：replace(pattern, replacement) 参数： pattern：需要替换的内容，可以是字符串或者一个带有 Symbol.replace 方法的对…

开发微信小程序中遇到一个需求：需要能做到播放暂停音频，同时能够实时显示时间进度条（当然，进度条可拖拽），另外还要能够左右切换音频播放。 所以就想到了微信小程序原生的方法wx.createInnerAudioContext()，完成的同时外送一个可倍速的功能。当然如果你的音频有不同角色的链接，还可以实…

水印通常用于保护版权、增强品牌识别度或提供额外的信息。 通过在前端实现水印，可以有效地保护内容的版权，增强品牌识别度，提供额外的信息，同时满足法律合规和安全防护的需求。 1.通过css背景图 可以通过CSS的background-image属性，将水印图片设置为页面的背景图。这种方式简单易用，适用于…

默认已经安装好各种依赖，主要用到element-plus、axios。 通过Upload组件的http-request属性实现自定义图片上传请求功能。 代码实现： 通过自定义的uploadRequest方法，来实现图片上传和回显。 <template> <el-form :mode…

01-for和forEach for循环是最常规最通用的一种循环遍历方法； forEach方法是一个高阶函数，会引入额外的函数调用开销，forEach会改变原数组； 1.性能上的比较 for>forEach for循环直接操作索引，没有额外的函数调用和上下文，所以性能是最快的 for可以使用b…