1 2 3 4 5 6 7 | <div id="home"> <div id="top">top</div> <div id="center"> <div id="left">left</div> <div id="right">right</div> </div> </div> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | #home{ color : blue; width : 600px; height : 500px; borderutset; #top{ borderutset; width : 90%; } #center{ borderutset; height : 300px; width : 90%; #left{ borderutset; float : left; width : 40%; } #right{ borderutset; float : left; width : 40%; } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | #home { color: blue; width: 600px; height: 500px; border: outset; } #home #top { border: outset; width: 90%; } #home #center { border: outset; height: 300px; width: 90%; } #home #center #left { border: outset; float: left; width: 40%; } #home #center #right { border: outset; float: left; width: 40%; } |
1 2 3 4 5 6 7 8 | a { color: red; text-decoration: none; &:hover {// 有 & 时解析的是同一个元素或此元素的伪类,没有 & 解析是后代元素 color: black; text-decoration: underline; } } |
1 2 3 4 5 6 7 8 | a { color: red; text-decoration: none; } a:hover { color: black; text-decoration: underline; } |
1 2 3 4 5 | @init: #111111; @transition: @init*2; .switchColor { color: @transition; } |
1 2 3 | .switchColor { color: #222222; } |
1 2 3 4 5 6 7 8 | lighten(@color, 10%); // return a color which is 10% *lighter* than @color darken(@color, 10%); // return a color which is 10% *darker* than @color saturate(@color, 10%); // return a color 10% *more* saturated than @color desaturate(@color, 10%);// return a color 10% *less* saturated than @color fadein(@color, 10%); // return a color 10% *less* transparent than @color fadeout(@color, 10%); // return a color 10% *more* transparent than @color spin(@color, 10); // return a color with a 10 degree larger in hue than @color spin(@color, -10); // return a color with a 10 degree smaller hue than @color |
1 2 3 4 | init: #f04615; #body { background-color: fadein(@init, 10%); } |
1 2 3 | #body { background-color: #f04615; } |
欢迎光临 电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/) | Powered by Discuz! 7.0.0 |