Rumah > hujung hadapan web > tutorial js > less简单实用的案列

less简单实用的案列

php中世界最好的语言
Lepaskan: 2018-03-12 16:26:20
asal
1553 orang telah melayarinya

这次给大家带来less简单实用的案列,使用less的注意事项有哪些,下面就是实战案例,一起来看一下。

//这里是一些简单的LESS语法@width:400px;@height:300px;@font_size:12px;@bgColor: #000;textarea {
    width:@width;
    height:@height;
    
font-size
:@font_size;
    
background-color
: @bgColor;
}
.frame {
    .fun(123px);
    background-color: @bgColor;
    .select {
    width: 100px
  }
}
.fun(@px) {
  height: @px
}
Salin selepas log masuk

编译成 CSS 后的代码为

textarea {  width: 400px;  height: 300px;  font-size: 12px;  background-color: #000000;
}.frame {  height: 123px;  background-color: #000000;
}.frame .select {  width: 100px;
}
Salin selepas log masuk

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

相关阅读:

Rxjs的使用详解

js-xlsx的工具类库xlsxUtils的使用详解

javascript怎样做出决策树

Atas ialah kandungan terperinci less简单实用的案列. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan