water.css项目简介

2021年02月13日 by 张 鑫旭 阅读 3792 次, 今日 4 次

water.css占位图

介绍一个CSS项目,5.9K Star的CSS项目Water.css,适用于简单页面的美化,对于经常需要做演示页面的开发者会很有用。

阅读全文…

使用grid-area等Grid布局属性轻松实现元素层叠效果

2021年02月12日 by 张 鑫旭 阅读 3585 次, 今日 7 次

重叠grid元素布局

使用Grid布局让元素重叠应该是最佳技术实践了,比margin负值和absolute绝对定位使用更方便,可以使用grid-area和多个其他CSS属性实现,有兴趣可以进来一看究竟。

阅读全文…

巧用两个type=range input实现区域范围选择

2021年02月11日 by 张 鑫旭 阅读 3459 次, 今日 3 次

封面图占位图-区域范围选择

type=range类型输入框UI自定义兼容性很好很实用,但是只是单值选择,有没有可能直接两个拖拽按钮实现范围选择呢?可以的,活用CSS即可,JS只需做一点微小的支持。

阅读全文…

使用::part伪元素改变Shadow DOM的CSS样式

2021年02月6日 by 张 鑫旭 阅读 3621 次, 今日 6 次

css part伪元素马儿开心跑占位图

详细介绍CSS ::part伪元素,以及和Shadow DOM中<slot&gt一起使用的细节知识,多个demo和截图,希望可以帮到您的学习。

阅读全文…

一行CSS实现全站中文简繁转换

2021年01月27日 by 张 鑫旭 阅读 11537 次, 今日 61 次

雪景占位

无需改变文本内容,直接一行CSS,就可以让简体中文变成繁体中文效果,就是这么神奇!

阅读全文…

巧用DOM API实现HTML字符的转义和反转义

2021年01月21日 by 张 鑫旭 阅读 7851 次, 今日 9 次

DOM API 转义和反转义HTML

借助DOM API的自身特性转义或者反转义HTML,你会发现原来这么简单,这么轻松,本文内容短小精悍,可谓Web前端开发必学必会基本技巧之一。

阅读全文…

告别JS keyCode

2021年01月4日 by 张 鑫旭 阅读 9779 次, 今日 20 次

键盘素材占位图封面

本文内容主要3部分,一是说明为什么keyCode舍弃了,二是对比event.key和event.code,三是整理常用功能键的event.key和event.code值,方便使用时候快速查找。

阅读全文…

几个常见功能重合DOM API的细节差异

2020年12月25日 by 张 鑫旭 阅读 7129 次, 今日 4 次

圣诞节快乐

介绍5组部分功能重叠的DOM API,带大家看看你可能不知道的一些细节差异,希望这些对比可以对您的学习有所帮助。

阅读全文…

纯CSS实现微信列表左滑显示按钮的交互效果

2020年12月13日 by 张 鑫旭 阅读 12109 次, 今日 16 次

可爱猫咪占位图

本文内容可谓是大开眼界,纯CSS实现自动边缘定位、带视差滚动的,iOS微信列表左滑显示按钮的交互效果,CSS可以做的远比你想象的更多。

阅读全文…

原来DOM还有toggleAttribute这样的JS API

2020年12月6日 by 张 鑫旭 阅读 7550 次, 今日 9 次

你值得拥有

各大现代浏览器在2018年底均支持了一个名为toggleAttribute的DOM API,专为HTML布尔属性设计,非常实用,不容错过。

阅读全文…