背景颜色
针对背景色做了几个固定的色值供大家来选择,.aui-bg-*
;
具体有以下几款:
.aui-bg-default {color: #212121;}
.aui-bg-white {color: #f5f5f5;}
.aui-bg-primary {color: #00bcd4;}
.aui-bg-success {color: #009688;}
.aui-bg-info {color: #03a9f4;}
.aui-bg-warning {color: #f1c40f;}
.aui-bg-danger {color: #e51c23;}
.aui-bg-pink {color: #e91e63;}
.aui-bg-purple {color: #673ab7;}
.aui-bg-indigo {color: #3f51b5;}
示例代码
<style>
.square {
width: 93%;
margin: 3%;
height: 3rem;
text-align: center;
font-size: 0.6rem;
line-height: 1rem;
padding: 0.5rem 0;
overflow: hidden;
border-radius: 3px;
}
</style>
<section class="aui-content-padded">
<div class="square aui-bg-default">
#f5f5f5<br>
.aui-bg-default
</div>
<div class="square aui-bg-primary aui-text-white">
#00bcd4<br>
.aui-bg-primary
</div>
<div class="square aui-bg-success aui-text-white">
#009688<br>
.aui-bg-success
</div>
<div class="square aui-bg-info aui-text-white">
#03a9f4<br>
.aui-bg-info
</div>
<div class="square aui-bg-warning aui-text-white">
#f1c40f<br>
.aui-bg-warning
</div>
<div class="square aui-bg-danger aui-text-white">
#e51c23<br>
.aui-bg-danger
</div>
<div class="square aui-bg-pink aui-text-white">
#e91e63<br>
.aui-bg-pink
</div>
<div class="square aui-bg-purple aui-text-white">
#673ab7<br>
.aui-bg-purple
</div>
<div class="square aui-bg-indigo aui-text-white">
#3f51b5<br>
.aui-bg-indigo
</div>
</section>