code_piece-优快云博客

原创 css 垂直居中方案

CSS垂直居中方案摘要本文整理了多种CSS实现垂直居中的方法，包括：1）Flex布局（推荐），适用于绝大多数场景；2）Grid布局，适合多列布局需求；3）绝对定位+Transform或Margin，适合弹窗等定位场景；4）Table布局（过时），主要用于老浏览器兼容。每种方法都配有完整代码示例，可根据不同需求选择最佳方案。Flex布局因其简单高效被强烈推荐，而Grid和绝对定位方案也有各自适用场景。

2025-06-24 14:49:27 848

原创大文件上传 js, express 实现

大文件上传技术摘要本文介绍了大文件上传的三种关键技术：秒传、分片上传和断点续传。实现方法包括客户端使用File.slice方法切分文件，WebWorker计算文件MD5哈希值实现秒传，Node.js服务器端通过multer中间件处理分片上传和文件合并。关键技术点包括：前端使用WebWorker避免主线程阻塞计算MD5，后端建立临时目录存储分片，最后合并为完整文件。该方案能有效解决大文件上传慢、网络中断等问题，提升上传效率和稳定性。

2025-06-24 01:13:45 900

原创 CSS 选择器顺序

CSS选择器优先级规则解析：CSS样式通过层叠机制生效，优先级由选择器权重决定。权重计算规则为：!important(10000) > 内联样式(1000) > id选择器(100) > 类/属性/伪类选择器(10) > 元素/伪元素选择器(1) > 通配符(0)。当权重相同时，后定义的样式优先。常见选择器类型包括通用、简单、属性、后代、兄弟、交集/并集选择器，以及伪类和伪元素。掌握这些规则可以精准控制样式应用。

2025-06-16 00:33:02 220

原创 this的绑定规则

本文总结了JavaScript中this的绑定规则及其应用场景。this的指向取决于调用方式而非定义位置，主要分为四种绑定规则：默认绑定（独立函数调用指向全局对象）、隐式绑定（通过对象调用指向调用对象）、显式绑定（通过call/apply/bind指定this）和new绑定（构造函数指向新对象）。其中new绑定优先级最高，其次是显式绑定和隐式绑定。此外，箭头函数不绑定this，而是继承外层作用域的this。文章通过代码示例演示了不同调用方式下this的指向，并提供了面试题帮助理解这些规则的实际应用。

2025-05-26 00:14:26 344

原创谷歌字体，Bunfun font第三方字体引入，优化性能...

从您的 Vite 项目收集 webfont 链接、导入和定义，下载css 和字体文件（隐私优先），将字体添加到您的捆绑包中（或通过开发服务器提供），并使用非渲染阻塞方法注入字体定义，同时将外部 css 和字体文件存储在持久文件缓存中，使它们可用于离线开发。

2024-07-02 16:48:39 1349

转载 JS 中常用api

Object.entries方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（ enumerable ）属性的键值对数组。Object.values方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（ enumerable ）属性的键值。ES5 引入了Object.keys方法，成员是参数对象自身的（不含继承的）所有可遍历（ enumerable ）属性的键名。六、Object.values()和Object.keys()是相反的操作，把一个对象的值转换为数组。

2023-05-25 17:13:37 148 1