flex-end为什么overflow无法滚动及解决方法

2021年12月8日 by 张 鑫旭 阅读 9818 次, 今日 8 次

flex-end与overflow

解释下为何 flex 布局中, flex-end 对齐不会触发 overflow 滚动效果,以及介绍解决方法,希望可以帮到遇到类似场景的人。

阅读全文…

深度好文: 从js visibilitychange Safari下无效说开去

2021年11月24日 by 张 鑫旭 阅读 9559 次, 今日 3 次

占位图

本文标题虽然是 visibilitychange,但实际上讲的是包括 pagehide, unload, beforeunload 等事件在内的Web页面生命周期知识,希望本文的整理可以帮到大家的学习。

阅读全文…

密码强度效果最佳实现一定是HTML meter元素

2021年11月14日 by 张 鑫旭 阅读 14347 次, 今日 10 次

配合meter元素,纯CSS也能实现3色状态带强中弱提示的密码强度效果,有基础有深入,本文可以学到的东西挺多。

最终渐变文字效果

阅读全文…

见多识广,介绍Web开发中current开头的一些API属性

2021年11月2日 by 张 鑫旭 阅读 9832 次, 今日 4 次

封面占位图

主要介绍 currentTarget、currentScript、currentTime、currentNode 和 currentSrc 这5个属性 API,有些是 JS 对象属性,有些是 HTML 对象属性,都挺有用的。

阅读全文…

JS复制文字到剪切板的极简实现及扩展

2021年10月28日 by 张 鑫旭 阅读 17666 次, 今日 28 次

JS复制文字到剪切板

多次遇到复制文字内容到剪切板的需求,每次都重新撸一遍代码,很糟心,所以特别写了篇文章,方便下次复用和溯源,也顺便帮助下其他同行小伙伴。

阅读全文…

CSS @counter-style规则详细介绍

2021年10月25日 by 张 鑫旭 阅读 8634 次, 今日 2 次

counter-style封面图

虽然目前项目符号支持的关键字值接近上百个,但是还是不能满足日常开发的需求,在这种情况下,@counter-style 出现了,可以让我们自定义计数规则。

阅读全文…

CSS content新的替换元素规范行为解读

2021年10月8日 by 张 鑫旭 阅读 11314 次, 今日 2 次

CSS content占位图

CSS悄然发展,已有CSS行为也跟着发生了变化,content属性就是其一,现在所有现代浏览器都支持普通HTML元素通过content属性改变元素内容,背后的原理和机制是什么呢?

阅读全文…

兼容IE浏览器的图片局部高斯模糊实现

2021年09月30日 by 张 鑫旭 阅读 8771 次, 今日 4 次

局部模糊占位图

CSS实现高斯模糊很方便,但是如果要兼容IE怎么办,如果希望局部模糊怎么办,如果希望模糊的图像有合成能力怎么办,此时,还是得借助 canvas,本文就深入介绍如何使用 canvas 实现带羽化的局部模糊效果。

阅读全文…

HTML slot 插槽元素深入

2021年09月24日 by 张 鑫旭 阅读 11384 次, 今日 3 次

slot占位图

本文应该是目前最深入最细致的介绍 HTML slot 插槽元素的文章了,如果您对 Web 组件开发感兴趣,则本文内容不容错过。

阅读全文…

借助HTML ping属性实现数据上报

2021年09月14日 by 张 鑫旭 阅读 11074 次, 今日 3 次

ping文章封面

Navigator.sendBeacon() 是浏览器提供的 JS 层面的数据上报方法,而 HTML ping 属性则是浏览器在 HTML 层面提供的 POST 数据埋点上报方法,比预想的好实用些,大家可以过来了解下,说不定就可以用起来。

阅读全文…