css模糊
发表于|更新于
|浏览量:
我们都希望自己过艺术的一生,但艺术是什么,却没有明确的定义。你过早地为人生设限,大多数时候是不成熟的表现。——灵遁者

对应的css代码为:
1 | filter: blur(1px); |
这里可以更改blur值的大小

1 | filter: blur(2px); |
相关推荐
2022-06-06
TailwindCss
懒惰象生锈一样,比操劳更能消耗身体;经常用的钥匙,总是亮闪闪的。——富兰克林 分享一个CSS框架,内置了很多css样式: https://www.tailwindcss.cn/ 使用方式: https://www.tailwindcss.cn/docs/installation 注意其不支持IE浏览器 仓库地址:https://github.com/tailwindlabs/tailwindcss 甚至你可以直接在Playground中进行尝试: https://play.tailwindcss.com/
2021-08-29
css定义变量
仁义忠信,乐善不倦,此天爵也 。一一《孟子》 写法如下 123456789101112131415161718192021222324252627282930313233<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> :root { /* 定义变量,需要--开头 */ --ruben-width: 200px; --ruben-height: 200px; --ruben-bg-color: #ff0000; } .ruben { /* 使用变量,需要var(变量名) */ background-color: var(--ruben-bg-color); width: var(--ruben-width); height: ...
2024-10-15
object-fit
能轻易做到别人感觉困难的事是人才;能轻易做到别人所不能做的工作是天才。——西德尼 讲一个小技巧,对于图片裁剪可以用这个属性:object-fit object-fit 是一个 CSS 属性,用于指定替换元素(如 <img> 和 <video>)内容的尺寸如何适应其容器。它定义了内容如何填充容器的大小,以及是否保持内容的比例 例如: 123<div style="width: 400px; height: 400px; overflow: hidden;"> <img src="https://vampireachao.github.io/imgs/head.png" style="width: 100%; height: auto; object-fit: cover; object-position: 0px 0px;transform: scale(1.2);"></div>
2025-05-21
升级项目为typescript
志不强者智不达。——《墨子·修身》 在一个 JavaScript + Vue 项目中引入 TypeScript 编写的代码组件 1. 保证依赖支持 TypeScript 安装 TypeScript 相关依赖(如果还没有): 12npm install --save-dev typescriptnpm install --save-dev @types/node 如果你的 Vue 版本是 Vue 2,建议也装上 vue-property-decorator 和 vue-class-component(class 风格): 1npm install --save vue-class-component vue-property-decorator 2. 配置 tsconfig.json 在项目根目录新建或完善 tsconfig.json,确保包括你的 TypeScript 组件目录。例如: 123456789101112131415161718192021222324252627{ "compilerOptions": { &q...
2020-07-19
图片预览放大js插件
分享一个非常简单的图片预览插件viewer 首先引入js和css viewer.js:下载链接 jquery1.11.3.js:下载链接 jquery-viewer.min.js:下载链接 viewer.css:下载链接 然后引入 123456789<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="{路径}/viewer.css" rel="external nofollow" rel="external nofollow"> <script src="...
2021-06-04
appendTo
人类经常把一个生涯发生的事,撰写成历史,在从那里看人生;其实,那不过是衣服,人生是内在的——罗曼。罗兰 我们可以使用jquery中的appendTo函数在一个标签追加到另一个标签内部的结尾 例如我博客这里 我们再执行 1$("<span>ruben</span>").appendTo(".navbar-brand") 执行完成后效果如下 <span>ruben</span>追加到我们的”阿超”后面了
