随笔分类 -  CSS3

Unocss(原子化css) 使用(vue3 + vite + ts)
摘要：Unocss 简单使用首先初始化一个vite项目 使用pnpm安装 pnpm create vite unocss-demo -- --template vue-ts 使用npm 安装 npm init vite@latest my-vue-app -- --template vue 使用yarn 阅读全文
posted @ 2023-06-18 10:23 威武的大萝卜 阅读(1660) 评论(0) 推荐(0)
UnoCSS 简化 CSS 的书写，Nice！
摘要：CSS 样式太多，重复写 在学习 UnoCSS 之前，我提出几个问题： 你是否有过写完了 HTML 之后，跳转到 style 写 CSS 这样来回跳转的痛苦？ 你是否有过不知道如何给节点取类名的痛苦（有的节点确实没啥必要取类名，但就是需要写 CSS）？ 你是否有过管理重复、繁杂、繁多的 CSS 而痛 阅读全文
posted @ 2023-06-18 10:16 威武的大萝卜 阅读(1499) 评论(0) 推荐(0)
好玩的 CSS - 40 个有趣的 CSS 网站
摘要：🔖 好玩的 CSS - 40 个有趣的 CSS 网站 🌐 基础学习 cssreference.io/ CSS 参考书 chokcoco.github.io/CSS-Inspira… CSS 灵感 www.awwwards.com/sites/zero-… UI 设计师的灵感源泉 htmlchea 阅读全文
posted @ 2021-10-21 10:53 威武的大萝卜 阅读(1799) 评论(0) 推荐(0)
canvas 爬坑路【属性篇】
摘要：简介 <canvas> 是 HTML5 新出的一个元素用于图形的绘制，但是 <canvas> 只是图形的容器，所有的绘制工作需要在 JavaScript 内部完成。 浏览器 IE8 及以下不支持 <canvas> 标签元素。 创建 canvas 元素 // 设置其 ID 待会通过 JavaScrip 阅读全文
posted @ 2021-10-21 09:32 威武的大萝卜 阅读(185) 评论(0) 推荐(0)
vue加scoped后无法修改样式（无法修改element UI 样式）
摘要：有的时候element提供的默认的样式不能满足项目的需要，就需要我们队标签的样式进行修改，但是发现修改的样式不起作用 第一种方法 原因：scoped 解决方法：去掉scoped 注意：此时该样式会污染全局样式，可以把它放在公共的css里面 为了不让所有的 el-input标签都是该样式，可以在HTM 阅读全文
posted @ 2021-10-12 17:23 威武的大萝卜 阅读(1152) 评论(0) 推荐(0)
vue——样式穿透/deep/ >>> ::v-deep 三者的区别
摘要：在项目中为了避免页面间样式污染常用scoped组件私有化，如果要改变element-ui的样式时需要用样式穿透才可复写样式。 1./deep/ 在vue3.0之前可使用，例如(复写样式前加/deep/)，vue3.0及后使用就会报错 /deep/ .el-input { width: 60px; } 阅读全文
posted @ 2021-10-09 14:31 威武的大萝卜 阅读(2247) 评论(0) 推荐(0)
CSS Grid 网格布局教程
摘要：一、概述 网格布局（Grid）是最强大的 CSS 布局方案。 它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。 上图这样的布局，就是 Grid 布局的拿手好戏。 Grid 布局与 Flex 布局有一定的相似性，都可 阅读全文
posted @ 2021-10-08 18:04 威武的大萝卜 阅读(215) 评论(0) 推荐(0)
CSS3中的display:grid网格布局介绍
摘要：1.网格布局(grid): 它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局; 2.基本概念： 容器和项目，如图所示： <div class="content"> <div class="b">1</div> <div class="b">2</div> <div class=" 阅读全文
posted @ 2021-09-29 20:06 威武的大萝卜 阅读(3065) 评论(0) 推荐(0)