CSS学习笔记:Less

什么是Less?

Less是一个CSS预处理器, Less文件后缀是.less

扩充了CSS 语言,使CSS具备一定的逻辑性、计算能力

可以通俗地理解:Less是一种更好用的CSS

注释

运算

嵌套

Less嵌套的作用:快速生成后代选择器

变量

**问题引入:**网页中,文字文字颜色基本都是统一的,如果网站改版,变换文字颜色,如何修改代码?

**解决方案:**使用Less变量,把颜色提前存储到一个容器,设置属性值为这个容器名

思考:

我一开始接触到这个方法的时候,觉得这完全没必要啊,直接写pink不是更方便吗?

但是存在即合理,这么写有点类似于C语言的宏定义,类似于后端的解耦合

这样如果后续网页改版,需要把主题色由pink改成green,就只需要修改一次即可

这样一来,代码的可维护性会更高

导入

在Less文件中导入其他的Less文件

导出

Less编译后生成的CSS文件默认在Less文件的同级目录下

如果想改变生成的CSS文件的位置,可使用导出

方法一:

方法二: 注意一定要在第一行添加代码

禁止导出

相关推荐
知识分享小能手2 分钟前
uni-app 入门学习教程,从入门到精通,uni-app 基础知识详解 (2)
前端·javascript·windows·学习·微信小程序·小程序·uni-app
文心快码BaiduComate10 分钟前
限时集福!Comate挂件/皮肤上线,符(福)气掉落中~
前端·后端·程序员
勇敢di牛牛10 分钟前
vue3 + mars3D 三分钟画一个地球
前端·vue.js
摇滚侠17 分钟前
Spring Boot 3零基础教程,WEB 开发 整合 Thymeleaf 笔记36
java·spring boot·笔记
来生硬件工程师21 分钟前
【STM32笔记】:P04 断言的使用
c语言·笔记·stm32·单片机·嵌入式硬件·硬件架构·硬件设计
曼城的天空是蓝色的27 分钟前
在环境条件下通过学习基于不同角度的交互信息来实现行人轨迹预测
学习
Cathy Bryant33 分钟前
大模型推理(九):采样温度
笔记·神经网络·机器学习·数学建模·transformer
阳光宅男@李光熠37 分钟前
【质量管理】构建供应链韧性的第一道防线——高风险供应商的识别
笔记·学习
岑梓铭40 分钟前
考研408《计算机组成原理》复习笔记,第五章(5)——CPU的【微程序控制器】
笔记·考研·408·计算机组成原理·计组
白云偷星子1 小时前
MySQL笔记13
数据库·笔记·mysql