css、less、scss
css、less、scss
曾泳锋
有机会多多请教
展开
-
通过css变量往css里面传值
得往父级标签传变量,子级才能接受得到<body :style="{'--color':'red'}"> <p class="aiqi"></p></body><style>.aiqi{ color:var(--color)}</style>原创 2021-07-10 14:07:33 · 1507 阅读 · 0 评论 -
sass基础
sass变量1.sass变量是以 $ 开头进行标识2.任何作为css属性值都可以用作变量值,甚至以空格分割的属性值,例如 $ basic-border: 1px solid black; 还有以逗号为分割的属性值,例如 $ plain-font: “Myriad Pro”、Myriad、“Helvetica Neue”、Helvetica、“Liberation Sans”、Arial和sans-serif; sans-serif;3.变量作用域,如果变量没有声明在{}内则做全局变量皆可使用,否则只能原创 2021-02-19 16:26:44 · 213 阅读 · 0 评论 -
安装sass和sass预处理器
安装sass和sass预处理器npm install sass sass-loader原创 2021-01-11 16:02:20 · 211 阅读 · 0 评论 -
安装less和less预处理器
安装less和less预处理器npm install less less-loader原创 2021-01-11 16:00:00 · 200 阅读 · 0 评论 -
Less基础使用
建立less在less文件可以引入其他文件如果引入文件时less格式,后缀名可以省略@import "aiqi";.aiqi{ width: 300px; height: 300px; background-color: red;}变量可以定义变量方便复用@backgroundColor:greenyellow!important;.aiqi{ background-color: @backgroundColor;}混入混合(Mixin)是一种将一原创 2021-01-02 11:10:04 · 312 阅读 · 0 评论 -
css3计算属性calc
height: calc(100vh - 100rpx);calc 的运算的时候,加减号两边至少留一个空格。原创 2021-01-11 16:06:03 · 236 阅读 · 0 评论 -
css 变量
css变量css中可以设置设置变量进行复用,一般作用拿来做主题颜色等//在page设置变量进行使用(网上其他资料写的都不行,只能规范在page里面)page{ --color:#fcaa23; --fz:80%;} .price{ color: var(--color); &::before{ font-size: var(--fz); content: "¥"; } }...原创 2021-01-10 14:35:21 · 93 阅读 · 0 评论 -
vw和vh单位
VW与VH单位/* vw: 视图的宽度,最大值是100vw *//* vh: 视图高度, 最大值100vh */原创 2021-01-06 10:49:44 · 695 阅读 · 0 评论 -
border-image
数据可视化border-image使用图片作用边框border-image-slice原理<style> .right{ /* 如果需要使用边框图片,border-style必须有值的 */ border-style: solid; /* border-image: 图片地址 */ border-image: url('./images/border.png'); /*原创 2021-01-06 10:48:02 · 89 阅读 · 0 评论