当前位置： 首页 > news >正文

CSS学习笔记：Less

news 来源：原创 2024/9/28 23:16:55

什么是Less？

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

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

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

注释

运算

 

嵌套

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

 

变量

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

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

 

思考：

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

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

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

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

导入

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

导出

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

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

方法一：

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

禁止导出

 

相关文章：

  • 【class18】人工智能初步----语音识别（4）
  • 边缘计算网关的用途及其使用方法-天拓四方
  • LeetCode 474.一和零
  • Window VScode配置Conda教程（成功版）
  • hadoop学习笔记
  • nginx编译安装手把手教学
  • Flutter 中的 Flow 小部件：全面指南
  • 嵌入式C语言指针详细解说
  • AI爆文写作：使用AI来帮你拆分吧，过程丝滑，效率翻倍：拆选题、拆标题、拆结构、拆逻辑、拆段落、收集素材吧！
  • 深度学习500问——Chapter09：图像分割（3）
  • 开发者的福音：免去搭建服务，让你的应用开发变得像吃蛋糕一样简单!
  • 无人机侦察：雷达系统概述
  • 【驱动】串口硬件流控和RS485自动收发
  • 2024最新私有化部署AI大模型，让每个人都有属于自己的AI助理
  • 【面试八股总结】索引（二）：B+树数据结构、索引使用场景、索引优化、索引失效
  • JS中 map, filter, some, every, forEach, for in, for of 用法总结
  • (十五)java多线程之并发集合ArrayBlockingQueue
  • 【刷算法】求1+2+3+...+n
  • js数组之filter
  • MySQL数据库运维之数据恢复
  • quasar-framework cnodejs社区
  • 从地狱到天堂，Node 回调向 async/await 转变
  • 树莓派 - 使用须知
  • 想晋级高级工程师只知道表面是不够的！Git内部原理介绍
  • 转载：[译] 内容加速黑科技趣谈
  • ​【C语言】长篇详解，字符系列篇3-----strstr，strtok，strerror字符串函数的使用【图文详解​】
  • ​一文看懂数据清洗：缺失值、异常值和重复值的处理
  • #ifdef 的技巧用法
  • (06)Hive——正则表达式
  • (20)docke容器
  • (cljs/run-at (JSVM. :browser) 搭建刚好可用的开发环境!)
  • （Redis使用系列） Springboot 使用redis的List数据结构实现简单的排队功能场景 九
  • （附源码）node.js知识分享网站 毕业设计 202038
  • (附源码）spring boot网络空间安全实验教学示范中心网站 毕业设计 111454
  • （附源码）ssm经济信息门户网站 毕业设计 141634
  • （十三）Flink SQL
  • (转)创业的注意事项
  • (转）可以带来幸福的一本书
  • .net core webapi Startup 注入ConfigurePrimaryHttpMessageHandler
  • .Net IOC框架入门之一 Unity
  • .Net多线程Threading相关详解
  • .net经典笔试题
  • .net企业级架构实战之7——Spring.net整合Asp.net mvc
  • @AliasFor 使用
  • @Not - Empty-Null-Blank
  • @RunWith注解作用
  • @WebService和@WebMethod注解的用法
  • [ vulhub漏洞复现篇 ] Apache APISIX 默认密钥漏洞 CVE-2020-13945
  • [.net 面向对象程序设计进阶] (19) 异步(Asynchronous) 使用异步创建快速响应和可伸缩性的应用程序...
  • [1] 平面(Plane)图形的生成算法
  • [BROADCASTING]tensor的扩散机制
  • [C++ 从入门到精通] 12.重载运算符、赋值运算符重载、析构函数
  • [Debugger]调试Arm设备
  • [EFI]MSI GF63 Thin 9SCXR电脑 Hackintosh 黑苹果efi引导文件
  • [flume$2]记录一个写自定义Flume拦截器遇到的错误