henry+-CSDN博客

原创 SVG ＜pattern＞标签的用法和应用场景

通过使用标签，可以在 SVG 图像内部定义可重复使用的任意图案。这些图案可以通过fill属性或stroke属性进行引用。

2024-06-20 17:21:45 544

原创高级前端开发需要知道的 25 个 JavaScript 单行代码

1. 不使用临时变量来交换变量的值2. 对象解构，让数据访问更便捷3. 浅克隆对象4. 合并对象5. 清理数组6. 将 NodeList 转换为数组7. 检查数组是否满足指定条件8. 将文本复制到剪贴板9. 删除数组重复项10. 取两个数组的交集11. 求数组元素的总和12. 根据指定条件判断，是否给对象的属性赋值13. 使用变量作为对象的键14. 离线状态检查器15. 离开页面弹出确认对话框16. 对象数组，根据对象的某个key求对应值的总和

2024-06-17 18:01:41 1268

转载纯CSS+单个div实现抖音LOGO

主要借助了两个伪元素实现了整体结构，借助了drop-shadow生成一层整体阴影。drop-shadow只能是单层阴影，所以另一层阴影需要多尝试。contrast(150%)brightness(110%)则可以增强图像的对比度和亮度，更贴近抖音LOGO的效果。

2024-06-08 12:23:08 47

原创 2024 Web 新特性 - 使用 Popover API 创建弹窗

Popover API正是为了简化这一过程而生，它为Web开发者提供了一套标准化的方法来创建和控制弹出窗口，确保了跨浏览器的一致性和易用性。Popover API 为开发者提供了一种声明式的方式来创建各种类型的弹窗。本文演示了如何使用 Popover API 创建弹窗

2024-06-07 11:38:13 524

原创使用 JS 实现在浏览器控制台打印图片 console.image()

在前端开发过程中，调试的时候，我门会使用 console.log 等方式查看数据。但对于图片来说，仅靠展示的数据与结构，是无法想象出图片最终呈现的样子的。虽然我们可以把图片数据通过 img 标签展示到页面上，或将图片下载下来进行预览。但这样的调试过程实在是复杂，何不实现一个 console.image() 呢？

2024-05-17 13:40:41 669 2