css实现毛玻璃效果
发表于|更新于
|浏览量:
醉过才知酒浓,爱过才知情重。你不能做我的诗,正如我不能做你的梦。——胡适
从这里学过来的
Backdrop Filter Effect With CSS | CSS-Tricks
核心代码如下:
1 | .container { |
效果
进阶学习backdrop:
相关推荐
2020-07-03
js时间转换
//时间戳格式化 1234567891011//时间转换 function stamptime(time) { var date = new Date(time) var Y = date.getFullYear() + '-'; var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '; var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'; ...
2022-07-12
teleport
你之前学了啥跟你以后能学啥没有什么本质联系——尤雨溪 顾名思义,teleport汉译过来就是传送的意思 官方文档:https://v3.cn.vuejs.org/guide/teleport.html#teleport 它可以将我们的元素传送到指定地点: 例如我们要实现一个挂载在body上的模态框,就可以使用teleport: 12345678910111213141516171819202122232425262728const app = Vue.createApp({});app.component('modal-button', { template: ` <button @click="modalOpen = true"> Open full screen modal! (With teleport!) </button> <teleport to="body"> <div v-if=&quo...
2025-09-15
HeroUI
美丽庄严强大,这里有活跃的人生。——王统照 HeroUI:打造漂亮、极速、现代化的 React UI 库体验在构建现代 Web 应用时,组件库绝对是开发者生产力的“加速器”。如果你正在寻找一个美观、性能卓越、易用且现代化的 React UI 组件库,HeroUI(原 NextUI)绝对值得你深入了解和体验! 项目简介HeroUI 是一个专为 React 打造的现代 UI 组件库,主打“Beautiful, fast and modern”。它极致美观、响应迅速,拥有丰富的组件体系和高度的可定制性,适合构建各种风格的前端项目。 仓库地址:heroui-inc/heroui 官网:https://heroui.com 主要语言:TypeScript Star 数:26,383+ Fork 数:1,933+ 标签:component-library components library reactjs 许可协议:MIT 为什么选择 HeroUI? 高颜值设计:官方主打“Beautiful”,所有组件设计风格简洁、时尚,适合各种现代 Web 应用。 极致性能:底层优...
2021-09-06
置顶小标签
美色不同面,皆佳于目;悲音不共声,皆快于耳。——王充 原理是通过一个红色div加红色背景颜色,旋转45后度再整个边框设置超出部分隐藏 效果如下: 代码: 12345<div class="top-article-tag-parent"> <div class="top-article-tag"> 置顶 </div></div> 样式: 123456789101112131415161718.top-article-tag-parent { overflow: hidden; position: absolute; right: 46rpx; height: 80rpx; width: 100rpx; zoom: 0.8;}.top-article-tag { color: #fff; background-color: #ff0000; width: 150rpx; height: 40rpx; text-align: cente...
2020-08-27
安全密码正则
当你回首往事时,不因碌碌无为而悔恨,不为虚度年华而羞耻,那你就可以很骄傲地和自己讲,你不负此生! 今天分享一个密码的正则,密码必须包含大、小写字母、数字、特殊符号至少三种,且长度为8-20 1^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]{8,20}$ javascript代码 123if (!(/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]{8...
2022-07-01
js让光标选择节点中部分文本
我走得很慢,但我从不后退。——林肯 如题,代码: 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title></head><body> <div id="container">ruben</div> <button>r</button> <button>u</button> <button>b</button> <button>e</button> <button>n</button> &...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog