Less 语言 颜色透明度
生活随笔
收集整理的這篇文章主要介紹了
Less 语言 颜色透明度
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
Less語(yǔ)言大大減少了css語(yǔ)言的代碼復(fù)雜量,如果想要改變某元素的顏色透明度可使用fade()算法
fade("顏色值",透明度百分比),百分比越小,透明度越強(qiáng) 如fade(red,20%)
例子如下:
css
@base :black;
@width :10px;
@base-color: red;
.radius {
border-radius: 4px;
}
div {
(@width *20);
height: 100px;
background-color: fade(@base-color,20%);
.radius;
p {
color: @base-color ;
}
}
html代碼
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<link rel="stylesheet/less" href="less.css"/>
<script src="less.js"></script>
<title>Less語(yǔ)言</title>
</head>
<body>
<div>
<p>嵌套代碼</p>
</div>
</body>
</html>
效果如下:
總結(jié)
以上是生活随笔為你收集整理的Less 语言 颜色透明度的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: elastic学习笔记
- 下一篇: 一个好用的浏览器暗色浏览插件 Da