-
alpinejs框架使用简介
Alpine.js是一个轻量级的JavaScript框架,设计灵感来源于Tailwind Css和Vue.js,就是一个借鉴Vue语法的JS版的TailwindAlpine.js的官方github网址:github.com/alpinejs/alpineAlpine.js无需安装,不依赖虚拟 DOM,模板通过遍历 DOM 来解析Alpine.js的一些主要特点: 1. 无需安装:同时支持npm方式和传统的script标签引入方式 2. 轻量级:核心库非常小,非常适合快速加载的网页 3. 声明式语法:使用声明式的语法,通过HTML属性来定义行为和状态 4. 响应式:提供响应式数据绑定,轻松...
2024-10-09 -
Node版本控制工具volta
nvm是一个全局级别的Node版本切换工具,可以通过命令来切换当前全局的Node版本volta是在nvm的全局Node版本切换功能基础上拓展了更为精细的项目级别Node版本切换,将项目与其所需Node版本绑定,确保每个项目都能使用正确的Node版本volta不仅可以控制Node版本,也可用于控制npm、pnpm、npx、yarn等常用的cil工具volta的实现原理就是在下载特定版本的软件并存放在工作目录中,然后由一个在Path环境变量中的同名“中转程序”去运行已经存在在工具目录的特定版本的软件 1、“中转程序”会首先在当前目录中查找package.json配置文件 2、如果有该配置文件...
2024-08-26 -
tailwind中的弹性布局
定义容器元素排列方向flex-row 左->右 flex-row-reverse 右->左 flex-col 上->下 flex-col-reverse 下->上元素换行flex-wrap 自动换行,向下方换行,第一行在上方 flex-wrap-reverse 自动换行,向上方换行,第一行在下方 flex-nowrap 不换行,所有元素宽度等比例缩小水平对齐justify-normal 不考虑对齐 justify-start start对齐 jus...
2023-12-12 -
tailwind中的滤镜
使用css中的filter属性添加各种滤镜使用filter-none可以删除全部滤镜模糊自定义: blur-[width] blur-none filter: blur(0) blur filter: blur(8px)亮度: brightness-[num]: num为一个表示亮度值的数字对比度: contrast-[num]: num为一个表示对比度的数字阴影自定义: drop-shadow-[x_y_[blur_]color] 分别表示水平偏移、垂直偏移、模糊值(可省略)、阴影颜色 预设了几个常用的值 drop-shadow-none drop-sha...
2023-12-11 -
tailwind中交互及SVG
强调色: accent-[color]/n ,复选框和单选组等元素选中时的颜色删除表单元素默认外观: appearance-none光标样式cursor-style,其中style可选值有 autodefaultnonecontext-menuhelp pointerprogresswaitcellcrosshair textvertical-textaliascopymove no-dropnot-allowede-resizen-resizene-resize nw-resizes-resizese-resizesw-resizew-resize ew-resizens...
2023-12-11