码迷,mamicode.com
首页 > 其他好文 > 详细

less中遇到的一些特殊的写法

时间:2021-06-02 10:39:59      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:https   less   特殊   pad   code   百分比   pre   元素   rgb   

1、为了重复使用CSS,例子如下:

.my-inline-block() {
  display: inline-block;
  font-size: 0;
}
.thing1 {
  .my-inline-block;
}
.thing2 {
  .my-inline-block;
}

注:来自less的官网https://less.bootcss.com/features/#variables

 2、Less中的darken

它降低了元素中颜色的亮度。 它有以下参数:

  • color :它代表颜色对象。

  • amount :它包含0 - 100%之间的百分比。

  • 方法:它是可选参数,通过将其设置为相对,用于相对于当前值进行调整。

 例子如下:
.myclass1{
   height:100px;
   width:100px;
   padding: 30px 0px 0px 25px;
   background-color: hsl(80, 90%, 20%);
   color:white;
}

.myclass2{
   height:100px;
   width:100px;
   padding: 30px 0px 0px 25px;
   background-color: darken(hsl(80, 90%, 20%), 10%);
   color:white;
}

  

less中遇到的一些特殊的写法

标签:https   less   特殊   pad   code   百分比   pre   元素   rgb   

原文地址:https://www.cnblogs.com/Roxxane/p/14810492.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!