CSS3
关注
分享
扫一扫
LeeTikPaak19
u can do all things
展开
-
【mask-image】为什么 B 站的弹幕可以不挡人物
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。为什么 B 站的弹幕可以不挡人物，以chrome浏览器为例子，-webkit-mask-image可以做到.mask-image CSS属性用于设置元素上遮罩层的图像。-webkit-mask-image是一个实验中的功能。原创 2022-10-25 17:30:40 · 209 阅读 · 0 评论 -
【兼容Chrome和Firefox】浏览器滚动条美化
Css里面，-webkit开头的伪元素::实现了Chrome浏览器滚动条的样式，Firefox scrollbar-width: thin实现了FireFox浏览器滚动条的样式。首先，我们需要创建一个类名autoList的div元素（一般来说这个类应该挂载到顶层的bodyDom，也可以对一些聊天框进行美化），给类autoList的dom元素添加滚动条。对于项目系统的美化处理，除了UI设计稿与组件自定义设计，对于浏览器滚动条的美化也是必要的，谁也不想自己的界面和布局都设计得很完美，结果出现了下图的滚动条吧。原创 2022-07-05 10:55:08 · 1202 阅读 · 0 评论 -
【手把手系列】用HTML5新增属性AudioContext实现一个动态的音乐播放界面
效果展示HTML代码如下<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link rel="stylesheet" href="./css/music.css" /></head><body> &原创 2021-07-13 17:17:58 · 1075 阅读 · 0 评论