css实现毛玻璃效果
发表于|更新于
|浏览量:
醉过才知酒浓，爱过才知情重。你不能做我的诗，正如我不能做你的梦。——胡适
从这里学过来的
Backdrop Filter Effect With CSS | CSS-Tricks
核心代码如下：
1 | .container { |
效果
进阶学习backdrop：
相关推荐
2023-02-05
pinia
天时不如地利，地利不如人和——孟子 分享一个Vuex的同类型vue状态管理框架：Pinia 中文文档：https://pinia.web3doc.top/ 它的Demo：https://stackblitz.com/github/piniajs/example-vue-3-vite?file=README.md 相比于Vuex:https://pinia.web3doc.top/introduction.html#%E4%B8%8E-vuex-%E7%9A%84%E6%AF%94%E8%BE%83 Pinia 提供了一个更简单的 API，具有更少的规范，提供了 Composition-API 风格的 API，最重要的是，在与 TypeScript 一起使用时具有可靠的类型推断支持。
2025-05-14
wangeditor实现鼠标悬停选中句子
学校要求教师在他的本职工作上成为一种艺术家。 —— 爱因斯坦 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103import { DomEditor, IDomEditor, SlateEditor, SlateTransforms } from '@wangeditor/editor'function addMouseHoverListener(editor: IDomEditor) { const editorElement = DomEditor.toDOMNode(editor, editor) let hoverTimeout: NodeJS.Timeout | nu...
2022-12-31
unocss
忍把浮名，换了浅斟低唱。——柳永《鹤冲天》 分享一个css框架unocss 可以通过class规则，生成对应样式，例如通过m-1生成margin: 0.25rem 而且规则可以通过 https://uno.antfu.me/ 进行查询 除了预制规则，还可以自定义规则： 123rules: [ ['m-1', { margin: '0.25rem' }],] 即可生成 1.m-1 { margin: 0.25rem; } 还可以通过正则的方式 1234rules: [ [/^m-(\d+)$/, ([, d]) => ({ margin: `${d / 4}rem` })], [/^p-(\d+)$/, match => ({ padding: `${match[1] / 4}rem` })],] 使用起来 123456<div class="m-100"> &...
2024-07-21
morjs转换小程序
健康是一种自由——在一切自由中首屈一指。——亚美路 就是这个项目： https://github.com/eleme/morjs 基于小程序 DSL（微信、支付宝）的，可扩展的多端研发框架，支持一键将微信或支付宝小程序转换为微信、支付宝、百度、字节、QQ、快手、淘宝、钉钉等小程序 或 Web 应用 官网 https://mor.ele.me/ 快速上手 快速上手环境准备MorJS 项目基于 node，请确保已具备较新的 node 环境（>=14），推荐使用 node 版本管理工具 nvm 来管理 node（Windows 下使用 nvm-windows），这样可以很方便地切换 node 版本，全局安装时候也不必再使用 sudo。 1# mac 或 linux 下安装 nvm$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash$ nvm -v0.39.1# 安装 node$ nvm install 14$ nvm use 14$ node -vv14....
2024-07-03
js页面历史返回
历史是一堆灰烬，但灰烬深处有余温。——黑格尔 我们可以使用history.back()来进行页面返回 history的文档： History API - Web API | MDN 除了返回还可以前进 1history.forward(); 以及 12// 向后跳转一个页面（等价于调用 back()）history.go(-1); 然后还有 12// 向前跳转一个页面，就像调用 forward()history.go(1); 当然传入0就是刷新 123// 以下语句都具有刷新页面的效果history.go(0);history.go(); 还有查看页面栈长度 1const numberOfEntries = history.length; 补充： 12345678910window.addEventListener("popstate", (event) => { alert(`位置：${document.location}，状态：${JSON.stringify(event.state)}...
2021-12-21
import模块失效
一点浩然气，千里快哉风。——宋•苏轼 昨天公司实习生问我这个import为什么一直报错，他代码如下： 报错信息如下： 1Uncaught SyntaxError: Cannot use import statement outside a module 实际上是因为script标签没有加type导致的 12345678910111213<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script type="module"> import {ruben} from './js/module.js' console.log(ruben) </script> </body></html> 这样就可以了 可以看到正常...