<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="stylesheet" href="css/masicon.css"/>
	<script src="../auroraUtil.js"></script>
</head>
<script>
	var str = auroraUtil.encodeParameters({username:'xueboren'});
	debugger;
	var obj = window.JSON.parse(str);
	
</script>
<style>
[class*="mas-i-"]:before{
	font-size:1.5rem;
	color:green;
}
[class*="mas-i-"]:after{
	padding-left:10px;
	content:attr(class);
}
.onw:before{
	
}
.two:before{
	font-size: 3rem;
	color: red;
	text-shadow: 4px 4px 4px rgba(0,0,0,0.4);
	background-clip:text
}
.three:before{
	font-size: 2rem;
	color: #EBEBEB;
}
.four:before{
	font-size: 2.5rem;
	color: #C0C0C0;
	-webkit-mask-image: -webkit-gradient(linear, left top, right bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}
.tip{
	color: rgba(67, 71, 79,0.5);
	font-size: 0.7rem;
}
</style>
<body>
	<div style="font-family:MAS_XueBoren;">&#xf001;</div>
	<p class="tip">以下所有内容都是字体，包括小图标。所有字体有关的css都可以用来修饰它们。</p>
	<div class="masicons">
		<div class="mas-i-user-back one"></div>
		<div class="mas-i-user-back two"></div>
		<div class="mas-i-user-back three"></div>
		<div class="mas-i-user-back four"></div>
	</div>
</body>
</html>