多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
### sass的写法 ~~~ h1{ font-size:17px; } h2{ font-size:18px; } $fontSize:12px; body{ $fontSize: 14px; font-size:$fontSize; } p{ font-size:$fontSize; } #top_nav{ line-height: 40px; text-transform: capitalize; background-color:#333; li{ float:left; &:last-child{ padding-top:20px; } +li{ paddng:10px; } } a{ display: block; padding: 0 10px; color: #fff; &:hover{ color:#ddd; } } li+li{ margin-top:12px; } li>a{ margin-left:10px; } >li>a>span{ font-size:16px; } } ~~~ ### 转换成css的样式 ~~~ h1 { font-size: 17px; } h2 { font-size: 18px; } body { font-size: 14px; } p { font-size: 12px; } #top_nav { line-height: 40px; text-transform: capitalize; background-color: #333; } #top_nav li { float: left; } #top_nav li:last-child { padding-top: 20px; } #top_nav li + li { paddng: 10px; } #top_nav a { display: block; padding: 0 10px; color: #fff; } #top_nav a:hover { color: #ddd; } #top_nav li + li { margin-top: 12px; } #top_nav li > a { margin-left: 10px; } #top_nav > li > a > span { font-size: 16px; } ~~~