YUS框架之us指令

众所周知的是，页面的样式渲染是由CSS来完成的。例如：width:100px;代表元素宽度为100像素；height:50px;代表元素高度为50像素；font-size:15px;代表元素中字体大小为15像素；下面一段就是标准的CSS语句：

.css1 {
width:100px;
height:100px;
line-height:100px;
background:#ff0;
}

上面的CSS代码，代表一个宽、高、行高为100px，并且背景色为黄色的方框元素，那么，用Yus如何来实现上述CSS代码的功能呢，先直接给出例子：

<div class="us-w-100 us-h-100 us-lh-100 uc-bg-ff0"></div>

解释如下：

us-w-100，代表宽度为100像素，即：width:100px;

us-h-100，代表高度为100像素，即：height:100px;

us-lh-100，代表行高为100像素，即：line-height:100px;

us-bg-ff0，代表背景色为#ff0黄色，即：background:#ff0;

由于在Yus中，数值相同的情况下，中间的属性可以用逗号分隔连续书写，所以上边的代码可以精简为：

<div class="us-w,h,lh-100 uc-bg-ff0"></div>

更多内容请参考官网：
www.runyus.com