随笔分类 -  前端

1 2 下一页
vue使用vite脚手架初始化项目
摘要：用 Vite 脚手架初始化一个 Vue3 项目 npm create vite@latest my-vue3-app 然后按提示选择(很简单)： Framework 选 Vue Variant 选 JavaScript npm run dev ：开发模式 npm run build ：打包生产文件 阅读全文
posted @ 2026-05-27 11:40 爱晒太阳的懒猫。。 阅读(6) 评论(0) 推荐(0)
flex布局(十)
摘要：<div class="responsive-grid"> <div class="grid-card"> <h3>卡片 1</h3> <p>内容描述</p> </div> <div class="grid-card"> <h3>卡片 2</h3> <p>内容描述</p> </div> <div c 阅读全文
posted @ 2026-04-12 12:26 爱晒太阳的懒猫。。 阅读(10) 评论(0) 推荐(0)
flex布局(五)
摘要：<div class="form-item"> <label>用户名：</label> <input type="text" placeholder="请输入"> </div> <div class="form-item"> <label>密码：</label> <input type="passw 阅读全文
posted @ 2026-04-11 23:31 爱晒太阳的懒猫。。 阅读(5) 评论(0) 推荐(0)
flex布局(四)
摘要：<div class="grid"> <div class="item">1</div> <div class="item">2</div> <div class="item">3</div> <div class="item">4</div> <div class="item">5</div> < 阅读全文
posted @ 2026-04-11 23:30 爱晒太阳的懒猫。。 阅读(7) 评论(0) 推荐(0)
flex布局(三)
摘要：<div class="card-list"> <div class="card"> <h3>标题 1</h3> <p>内容比较短的文字。</p> <button>购买</button> </div> <div class="card"> <h3>标题 2</h3> <p>内容非常非常长，占据了多行 阅读全文
posted @ 2026-04-11 23:28 爱晒太阳的懒猫。。 阅读(9) 评论(0) 推荐(0)
flex的布局(二)
摘要：<header class="navbar"> <div class="logo">🍔 我的网站</div> <nav> <a href="#">首页</a> <a href="#">关于</a> <a href="#">设置</a> </nav> </header> <style> .navba 阅读全文
posted @ 2026-04-11 15:29 爱晒太阳的懒猫。。 阅读(7) 评论(0) 推荐(0)
flex的布局(一)
摘要：<div class="container"> <div class="box">登录弹窗内容</div> </div> <style> .container { display: flex; /* 水平居中 */ justify-content: center; /* 垂直居中 */ align- 阅读全文
posted @ 2026-04-11 15:08 爱晒太阳的懒猫。。 阅读(9) 评论(0) 推荐(0)
CSS预处理器基础知识
摘要：在 CSS 的基础上添加了编程特性（变量、嵌套、函数、混入等），然后通过编译转换为标准的 CSS 代码。 完整的名字：Sass/SCSS SCSS 最常用功能速学指南 一、变量（Variables）- 最最常用 // 定义变量：$ $primary-color: #1890ff; $font-siz 阅读全文
posted @ 2026-04-08 09:11 爱晒太阳的懒猫。。 阅读(7) 评论(0) 推荐(0)

1 2 下一页