Authored by 2586703@qq.com

字体图标

No preview for this file type
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Mon Jul 13 14:23:17 2015
By Ads
</metadata>
<defs>
<font id="iconfont" horiz-adv-x="1024" >
<font-face
font-family="iconfont"
font-weight="500"
font-stretch="normal"
units-per-em="1024"
panose-1="2 0 6 3 0 0 0 0 0 0"
ascent="812"
descent="-212"
x-height="792"
bbox="0 -224 5637 812"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E60F"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".notdef" horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".null" horiz-adv-x="0"
/>
<glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
/>
<glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
<glyph glyph-name="uniE600" unicode="&#xe600;" horiz-adv-x="1463"
d="M798 -160q0 -46 25 -58t61 16l537 420q36 28 36 68t-36 68l-537 424q-36 29 -61 16.5t-25 -57.5v-238q-138 0 -252.5 -24.5t-192 -63t-137.5 -94t-94.5 -109.5t-57.5 -117t-31.5 -109.5t-11 -94t-1.5 -63.5t2 -25q47 62 87 104t90 78t103.5 57.5t127 36.5t161.5 21t207 6
v-262z" />
<glyph glyph-name="uniE601" unicode="&#xe601;"
d="M281 372q-14 -9 -23 -23t-9 -28v-7v-483h1q5 -24 24 -39.5t44 -15.5h582q28 0 48.5 20t20.5 49t-20.5 49t-48.5 20h41q35 0 59 24.5t24 58.5t-24 58.5t-59 24.5q35 0 59 24t24 58.5t-24 58.5t-59 24h-48q31 0 53.5 22.5t22.5 53.5v-13q0 31 -22.5 54t-53.5 24
q-125 6 -259 9q40 148 16 278q-8 44 -30.5 70.5t-49.5 31t-53 -4t-43 -35t-17 -62.5q-5 -34 -6.5 -64t-2.5 -42t-5 -30.5t-14 -42.5q-24 -60 -133 -115q-7 -2 -13 -6zM60 356q-25 0 -42.5 -17.5t-17.5 -42.5v-405q0 -25 17.5 -42.5t42.5 -17.5h134v525h-134z" />
<glyph glyph-name="uniE602" unicode="&#xe602;" horiz-adv-x="1323"
d="M643 472q0 -68 -47.5 -116t-113.5 -48q0 -68 47 -116t113.5 -48t113.5 48t47 116t-47 116t-113 48zM643 800q-79 0 -162 -28.5t-152 -74.5t-131 -102t-105 -110.5t-68 -101.5t-25 -75t25 -75t68 -102t105 -111t131 -101.5t152 -74.5t161.5 -29t161.5 29t152 74.5
t131 101.5t105 111t68 102t25 75t-25 75t-68 101.5t-105 110.5t-131 102t-152 74.5t-161 28.5zM643 -21q-88 0 -162 44t-117 120t-43 165t43 164.5t117 119.5t161.5 44t161.5 -44t117 -119.5t43 -164.5t-43 -165t-117 -120t-161 -44z" />
<glyph glyph-name="uniE603" unicode="&#xe603;"
d="M512 286v343h85v-426h-81v-2h-256v85h252zM512 -224q139 0 257 68.5t186.5 186.5t68.5 257t-68.5 257t-186.5 186.5t-257 68.5t-257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5z" />
<glyph glyph-name="uniE604" unicode="&#xe604;"
d="M774 324q13 -17 11.5 -39.5t-17.5 -38.5q0 -1 -1 -1l-427 -428q-18 -17 -42.5 -17t-42 17.5t-17.5 42t17 41.5l387 387l-387 387q-17 17 -17 41.5t17.5 42t42 17.5t42.5 -17l427 -428q1 0 1 -1z" />
<glyph glyph-name="uniE605" unicode="&#xe605;"
d="M707 748q-112 0 -195 -77q-83 77 -195 77q-121 0 -207 -88t-86 -212q0 -110 69 -194l2 -2l344 -391q30 -33 73 -33t73 33l344 391l2 2q69 84 69 194q0 124 -86 212t-207 88z" />
<glyph glyph-name="uniE606" unicode="&#xe606;" horiz-adv-x="5632"
d="M4316.5 156q54.5 0 93 38.5t38.5 93.5t-38.5 93.5t-93 38.5t-93.5 -38.5t-39 -93.5t39 -93.5t93.5 -38.5zM4910.5 156q54.5 0 93 38.5t38.5 93.5t-38.5 93.5t-93 38.5t-93.5 -38.5t-39 -93.5t39 -93.5t93.5 -38.5zM5504.5 156q54.5 0 93.5 38.5t39 93.5t-39 93.5
t-93.5 38.5t-93 -38.5t-38.5 -93.5t38.5 -93.5t93 -38.5z" />
<glyph glyph-name="uniE607" unicode="&#xe607;" horiz-adv-x="1643"
d="M547 190h-1l45 -46l248 239l-45 46l-201 -194l-195 201l-46 -44z" />
<glyph glyph-name="uniE608" unicode="&#xe608;" horiz-adv-x="1821"
d="M930 135q-14 -13 -33.5 -13t-33.5 13l-252 242q-14 13 -14 32t14 32t34 13t34 -13l251 -242q14 -13 14 -32t-14 -32zM360 135q-14 13 -14 32t14 32l251 242q14 13 34 13t33.5 -13t13.5 -32t-13 -32l-252 -242q-14 -13 -33.5 -13t-33.5 13z" />
<glyph glyph-name="uniE609" unicode="&#xe609;" horiz-adv-x="1821"
d="M930 377l-251 -242q-14 -13 -34 -13t-34 13t-14 32t14 32l252 242q14 13 33.5 13t33.5 -13t14 -32t-14 -32zM427 441l252 -242q13 -13 13 -32t-13.5 -32t-33.5 -13t-34 13l-251 242q-14 13 -14 32t14 32t33.5 13t33.5 -13z" />
<glyph glyph-name="uniE60A" unicode="&#xe60a;"
d="M1024 288q0 -139 -68.5 -257t-186.5 -186.5t-257 -68.5t-257 68.5t-186.5 186.5t-68.5 257t68.5 257t186.5 186.5t257 68.5t257 -68.5t186.5 -186.5t68.5 -257zM801 498l-365 -366l-156 156l-37 -37l193 -193l403 403z" />
<glyph glyph-name="uniE60B" unicode="&#xe60b;" horiz-adv-x="1344"
d="M1280 236h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5zM1280 -212h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5zM1280 684
h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5z" />
<glyph glyph-name="uniE60C" unicode="&#xe60c;"
d="M1024 300q0 -139 -68.5 -257t-186.5 -186.5t-257 -68.5t-257 68.5t-186.5 186.5t-68.5 257t68.5 257t186.5 186.5t257 68.5t257 -68.5t186.5 -186.5t68.5 -257z" />
<glyph glyph-name="uniE60D" unicode="&#xe60d;" horiz-adv-x="1685"
d="M1229 -77l289 -135l58 124l-281 131q-21 -54 -66 -120zM944 475v-134h137v258q42 47 62 81l-118 69q-2 -4 -8 -12t-24.5 -30.5t-41 -45.5t-60.5 -54.5t-81 -59.5l75 -114q30 20 59 42zM1524 19v304h-605v-304h137v167h332v-167h136zM1283 169h-137v-66q0 -31 -20 -57.5
t-49.5 -45t-70.5 -34.5t-76.5 -25t-73.5 -17l74 -124q55 14 103 30.5t95.5 43t80.5 58t53.5 75.5t20.5 96v66zM1088 570l31 -133q42 9 85 21q19 -49 59 -78q49 -36 120 -36q45 0 92 14q69 21 133 78l-67 125q-17 -19 -46 -40.5t-60 -31.5q-63 -19 -91 1q-4 3 -8 9
q147 51 240 103l-81 111q-74 -38 -173 -74v85h-137v-129q-50 -14 -97 -25zM755 477v137h-348q11 42 19 84l-134 26q-11 -56 -28 -110h-200v-137h142q-79 -149 -206 -260l90 -103q43 38 85 83v-389h137v165h260v-24h-124l48 -137h83q54 0 92 38t38 92v490h-373q11 22 21 45
h398zM312 134h260v-24h-260v24zM312 295h260v-24h-260v24zM1683 732q0 -33 -22.5 -56t-55.5 -23t-56 23t-23 56t23 55.5t56 22.5t55.5 -22.5t22.5 -55.5zM1545 732q0 -26 17.5 -44.5t42.5 -18.5t41.5 18t16.5 44q0 27 -16.5 45.5t-42.5 18.5q-25 0 -42 -18.5t-17 -44.5z
M1592 691h-17v79q17 2 29 2q18 0 26 -6t8 -17q0 -13 -16 -19v-1q10 -3 14 -19q2 -13 6 -19h-19q-2 3 -6 19q-2 12 -16 12h-9v-31zM1593 735h8q18 0 18 12t-16 12q-6 0 -10 -1v-23z" />
<glyph glyph-name="uniE60E" unicode="&#xe60e;" horiz-adv-x="3958"
d="M611 639h-177l-150 -222l-95 222h-178l168 -395v-2l-31 -243h156l30 231zM699 481q-100 0 -179.5 -72.5t-92.5 -175.5q-13 -105 51 -178q61 -68 157 -68q99 0 178.5 72.5t92.5 175.5q13 104 -51 177q-60 69 -156 69zM759 233q-5 -41 -35.5 -70.5t-68.5 -29.5
q-37 0 -60 27q-27 30 -21 75q5 41 36 70.5t69 29.5q36 0 59 -27q27 -30 21 -75zM1656 481q-100 0 -179.5 -72.5t-92.5 -175.5q-13 -105 51 -178q61 -68 157 -68q99 0 178.5 72.5t92.5 175.5q13 104 -51 177q-60 69 -156 69zM1717 233q-6 -41 -36.5 -70.5t-68.5 -29.5
q-37 0 -60 27q-27 30 -21 75q5 41 36 70.5t69 29.5q36 0 60 -27q26 -30 21 -75zM1332 418q-44 50 -114 50q-51 0 -97 -27l-10 -6l26 204h-156l-80 -640h155l37 288q3 24 22 41t43 17q25 0 40.5 -17.5t11.5 -41.5l-36 -287h156l37 298q10 71 -35 121zM2949 460l-37 -288
q-3 -24 -22 -41t-44 -17q-24 0 -39.5 17.5t-12.5 41.5l37 287h-156l-38 -298q-9 -71 36 -121q43 -50 114 -50q51 0 97 27l9 6l-3 -25h156l58 461h-155zM1951 639l-55 -432h156l55 432h-156zM1970 168q-37 0 -67 -26.5t-34.5 -63.5t18.5 -63q22 -26 59 -26t67 26.5t34 63.5
q5 37 -18 63t-59 26zM2608 178q6 51 -14.5 93.5t-62.5 65.5l-8 5l8 5q39 21 64 57t30 78q8 63 -30 108q-37 44 -97 48l-6 1h-314l-81 -640h317q72 3 128.5 55t65.5 124zM2451 200q-3 -27 -25 -46.5t-50 -19.5h-106l17 134h107q27 -1 43.5 -20.5t13.5 -47.5zM2483 447
q-3 -25 -23 -43t-45 -18h-113l15 124h112q25 0 41.5 -18.5t12.5 -44.5zM3132 -211q65 0 124 37.5t89 99.5l264 534h-156l-127 -258l-63 258h-156l113 -471l-7 -14q-8 -18 -25 -29t-36 -11q-10 0 -20 4l-29 11l-67 -139l29 -10q31 -12 67 -12zM3943 646q0 -65 -45 -110.5
t-110.5 -45.5t-111 45.5t-45.5 111t45.5 110.5t111.5 45q65 0 110 -45t45 -111zM3670 646q0 -52 34 -88t84 -36q49 -1 82.5 35.5t33.5 87.5q0 53 -33.5 89.5t-84.5 36.5q-49 0 -82.5 -36.5t-33.5 -88.5zM3763 566h-35v155q35 5 58 5q36 0 52 -12t16 -34q0 -26 -32 -37v-2
q20 -6 27 -37q5 -26 11 -38h-37q-4 5 -12 38q-4 23 -31 23h-17v-61zM3764 653h17q35 0 35 23t-32 23q-13 0 -20 -1v-45z" />
<glyph glyph-name="uniE60F" unicode="&#xe60f;"
d="M682 74q-108 -89 -249 -89q-107 0 -197.5 53t-143.5 143.5t-53 197.5t53 197.5t143.5 143.5t197.5 53t197.5 -53t143.5 -143.5t53 -197.5q0 -141 -89 -249l286 -286l-56 -56zM433.5 64q130.5 0 222.5 92t92 222.5t-92 223t-222.5 92.5t-223 -92.5t-92.5 -223t92.5 -222.5
t223 -92z" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type
No preview for this file type
*{margin: 0;padding: 0;list-style: none;}
/*
KISSY CSS Reset
理念:1. reset 的目的不是清除浏览器的默认样式,这仅是部分工作。清除和重置是紧密不可分的。
2. reset 的目的不是让默认样式在所有浏览器下一致,而是减少默认样式有可能带来的问题。
3. reset 期望提供一套普适通用的基础样式。但没有银弹,推荐根据具体需求,裁剪和修改后再使用。
特色:1. 适应中文;2. 基于最新主流浏览器。
维护:玉伯<lifesinger@gmail.com>, 正淳<ragecarrier@gmail.com>
*/
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ {
margin: 0;
padding: 0;
}
/** 设置默认字体 **/
body,
button, input, select, textarea /* for ie */ {
font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
small { font-size: 12px; } /* 小于 12px 的中文很难阅读,让 small 正常化 */
/** 重置列表元素 **/
ul, ol { list-style: none; }
/** 重置文本格式元素 **/
a { text-decoration: none; }
a:hover { text-decoration: underline; }
/** 重置表单元素 **/
legend { color: #000; } /* for ie6 */
fieldset, img { border: 0; } /* img 搭车:让链接里的 img 无边框 */
button, input, select, textarea { font-size: 100%; } /* 使得表单元素在 ie 下能继承字体大小 */
/* 注:optgroup 无法扶正 */
/** 重置表格元素 **/
table { border-collapse: collapse; border-spacing: 0; }
/* 清除浮动 */
.ks-clear:after, .clear:after {
content: '\20';
display: block;
height: 0;
clear: both;
}
.ks-clear, .clear {
*zoom: 1;
}
.main {padding: 30px 100px;}
.main h1{font-size:36px; color:#333; text-align:left;margin-bottom:30px; border-bottom: 1px solid #eee;}
.helps{margin-top:40px;}
.helps pre{
padding:20px;
margin:10px 0;
border:solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists li{
float:left;
width: 100px;
height:180px;
text-align: center;
}
.icon_lists .icon{
font-size: 42px;
line-height: 100px;
margin: 10px 0;
color:#333;
-webkit-transition: font-size 0.25s ease-out 0s;
-moz-transition: font-size 0.25s ease-out 0s;
transition: font-size 0.25s ease-out 0s;
}
.icon_lists .icon:hover{
font-size: 100px;
}
... ...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>IconFont</title>
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
</head>
<body>
<div class="main">
<h1>IconFont 图标</h1>
<ul class="icon_lists clear">
<li>
<i class="icon iconfont">&#xe600;</i>
<div class="name">share</div>
<div class="code">&amp;#xe600;</div>
<div class="fontclass">.yoho-share</div>
</li>
<li>
<i class="icon iconfont">&#xe601;</i>
<div class="name">good</div>
<div class="code">&amp;#xe601;</div>
<div class="fontclass">.yoho-good</div>
</li>
<li>
<i class="icon iconfont">&#xe602;</i>
<div class="name">view</div>
<div class="code">&amp;#xe602;</div>
<div class="fontclass">.yoho-view</div>
</li>
<li>
<i class="icon iconfont">&#xe603;</i>
<div class="name">time</div>
<div class="code">&amp;#xe603;</div>
<div class="fontclass">.yoho-time</div>
</li>
<li>
<i class="icon iconfont">&#xe604;</i>
<div class="name">enter</div>
<div class="code">&amp;#xe604;</div>
<div class="fontclass">.yoho-enter</div>
</li>
<li>
<i class="icon iconfont">&#xe605;</i>
<div class="name">like</div>
<div class="code">&amp;#xe605;</div>
<div class="fontclass">.yoho-like</div>
</li>
<li>
<i class="icon iconfont">&#xe606;</i>
<div class="name">more</div>
<div class="code">&amp;#xe606;</div>
<div class="fontclass">.more</div>
</li>
<li>
<i class="icon iconfont">&#xe607;</i>
<div class="name">arrow-down</div>
<div class="code">&amp;#xe607;</div>
<div class="fontclass">.enter</div>
</li>
<li>
<i class="icon iconfont">&#xe608;</i>
<div class="name">up</div>
<div class="code">&amp;#xe608;</div>
<div class="fontclass">.up</div>
</li>
<li>
<i class="icon iconfont">&#xe609;</i>
<div class="name">down</div>
<div class="code">&amp;#xe609;</div>
<div class="fontclass">.downn</div>
</li>
<li>
<i class="icon iconfont">&#xe60a;</i>
<div class="name">gou</div>
<div class="code">&amp;#xe60a;</div>
<div class="fontclass">.gou</div>
</li>
<li>
<i class="icon iconfont">&#xe60f;</i>
<div class="name">search</div>
<div class="code">&amp;#xe60f;</div>
<div class="fontclass">.search</div>
</li>
<li>
<i class="icon iconfont">&#xe60b;</i>
<div class="name">menu-btn</div>
<div class="code">&amp;#xe60b;</div>
<div class="fontclass">.icon1</div>
</li>
<li>
<i class="icon iconfont">&#xe60c;</i>
<div class="name">point1</div>
<div class="code">&amp;#xe60c;</div>
<div class="fontclass">.point1</div>
</li>
<li>
<i class="icon iconfont">&#xe60d;</i>
<div class="name">logo2</div>
<div class="code">&amp;#xe60d;</div>
<div class="fontclass">.logo2</div>
</li>
<li>
<i class="icon iconfont">&#xe60e;</i>
<div class="name">logo1</div>
<div class="code">&amp;#xe60e;</div>
<div class="fontclass">.logo1</div>
</li>
</ul>
<div class="helps">
第一步:使用font-face声明字体
<pre>
@font-face {font-family: 'iconfont';
src: url('iconfont.eot'); /* IE9*/
src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('iconfont.woff') format('woff'), /* chrome、firefox */
url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}
</pre>
第二步:定义使用iconfont的样式
<pre>
.iconfont{
font-family:"iconfont" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;}
</pre>
第三步:挑选相应图标并获取字体编码,应用于页面
<pre>
&lt;i class="iconfont"&gt;&amp;#x33;&lt;/i&gt;
</pre>
</div>
</div>
</body>
</html>
... ...
@font-face {font-family: "iconfont";
src: url('iconfont.eot'); /* IE9*/
src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('iconfont.woff') format('woff'), /* chrome、firefox */
url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}
.iconfont {
font-family:"iconfont" !important;
font-size:16px;
font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
.icon-yoho-share:before { content: "\e600"; }
.icon-yoho-good:before { content: "\e601"; }
.icon-yoho-view:before { content: "\e602"; }
.icon-yoho-time:before { content: "\e603"; }
.icon-yoho-enter:before { content: "\e604"; }
.icon-yoho-like:before { content: "\e605"; }
.icon-more:before { content: "\e606"; }
.icon-enter:before { content: "\e607"; }
.icon-up:before { content: "\e608"; }
.icon-downn:before { content: "\e609"; }
.icon-gou:before { content: "\e60a"; }
.icon-search:before { content: "\e60f"; }
.icon-icon1:before { content: "\e60b"; }
.icon-point1:before { content: "\e60c"; }
.icon-logo2:before { content: "\e60d"; }
.icon-logo1:before { content: "\e60e"; }
... ...
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Mon Jul 13 14:23:17 2015
By Ads
</metadata>
<defs>
<font id="iconfont" horiz-adv-x="1024" >
<font-face
font-family="iconfont"
font-weight="500"
font-stretch="normal"
units-per-em="1024"
panose-1="2 0 6 3 0 0 0 0 0 0"
ascent="812"
descent="-212"
x-height="792"
bbox="0 -224 5637 812"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E60F"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".notdef" horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".null" horiz-adv-x="0"
/>
<glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
/>
<glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
<glyph glyph-name="uniE600" unicode="&#xe600;" horiz-adv-x="1463"
d="M798 -160q0 -46 25 -58t61 16l537 420q36 28 36 68t-36 68l-537 424q-36 29 -61 16.5t-25 -57.5v-238q-138 0 -252.5 -24.5t-192 -63t-137.5 -94t-94.5 -109.5t-57.5 -117t-31.5 -109.5t-11 -94t-1.5 -63.5t2 -25q47 62 87 104t90 78t103.5 57.5t127 36.5t161.5 21t207 6
v-262z" />
<glyph glyph-name="uniE601" unicode="&#xe601;"
d="M281 372q-14 -9 -23 -23t-9 -28v-7v-483h1q5 -24 24 -39.5t44 -15.5h582q28 0 48.5 20t20.5 49t-20.5 49t-48.5 20h41q35 0 59 24.5t24 58.5t-24 58.5t-59 24.5q35 0 59 24t24 58.5t-24 58.5t-59 24h-48q31 0 53.5 22.5t22.5 53.5v-13q0 31 -22.5 54t-53.5 24
q-125 6 -259 9q40 148 16 278q-8 44 -30.5 70.5t-49.5 31t-53 -4t-43 -35t-17 -62.5q-5 -34 -6.5 -64t-2.5 -42t-5 -30.5t-14 -42.5q-24 -60 -133 -115q-7 -2 -13 -6zM60 356q-25 0 -42.5 -17.5t-17.5 -42.5v-405q0 -25 17.5 -42.5t42.5 -17.5h134v525h-134z" />
<glyph glyph-name="uniE602" unicode="&#xe602;" horiz-adv-x="1323"
d="M643 472q0 -68 -47.5 -116t-113.5 -48q0 -68 47 -116t113.5 -48t113.5 48t47 116t-47 116t-113 48zM643 800q-79 0 -162 -28.5t-152 -74.5t-131 -102t-105 -110.5t-68 -101.5t-25 -75t25 -75t68 -102t105 -111t131 -101.5t152 -74.5t161.5 -29t161.5 29t152 74.5
t131 101.5t105 111t68 102t25 75t-25 75t-68 101.5t-105 110.5t-131 102t-152 74.5t-161 28.5zM643 -21q-88 0 -162 44t-117 120t-43 165t43 164.5t117 119.5t161.5 44t161.5 -44t117 -119.5t43 -164.5t-43 -165t-117 -120t-161 -44z" />
<glyph glyph-name="uniE603" unicode="&#xe603;"
d="M512 286v343h85v-426h-81v-2h-256v85h252zM512 -224q139 0 257 68.5t186.5 186.5t68.5 257t-68.5 257t-186.5 186.5t-257 68.5t-257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5z" />
<glyph glyph-name="uniE604" unicode="&#xe604;"
d="M774 324q13 -17 11.5 -39.5t-17.5 -38.5q0 -1 -1 -1l-427 -428q-18 -17 -42.5 -17t-42 17.5t-17.5 42t17 41.5l387 387l-387 387q-17 17 -17 41.5t17.5 42t42 17.5t42.5 -17l427 -428q1 0 1 -1z" />
<glyph glyph-name="uniE605" unicode="&#xe605;"
d="M707 748q-112 0 -195 -77q-83 77 -195 77q-121 0 -207 -88t-86 -212q0 -110 69 -194l2 -2l344 -391q30 -33 73 -33t73 33l344 391l2 2q69 84 69 194q0 124 -86 212t-207 88z" />
<glyph glyph-name="uniE606" unicode="&#xe606;" horiz-adv-x="5632"
d="M4316.5 156q54.5 0 93 38.5t38.5 93.5t-38.5 93.5t-93 38.5t-93.5 -38.5t-39 -93.5t39 -93.5t93.5 -38.5zM4910.5 156q54.5 0 93 38.5t38.5 93.5t-38.5 93.5t-93 38.5t-93.5 -38.5t-39 -93.5t39 -93.5t93.5 -38.5zM5504.5 156q54.5 0 93.5 38.5t39 93.5t-39 93.5
t-93.5 38.5t-93 -38.5t-38.5 -93.5t38.5 -93.5t93 -38.5z" />
<glyph glyph-name="uniE607" unicode="&#xe607;" horiz-adv-x="1643"
d="M547 190h-1l45 -46l248 239l-45 46l-201 -194l-195 201l-46 -44z" />
<glyph glyph-name="uniE608" unicode="&#xe608;" horiz-adv-x="1821"
d="M930 135q-14 -13 -33.5 -13t-33.5 13l-252 242q-14 13 -14 32t14 32t34 13t34 -13l251 -242q14 -13 14 -32t-14 -32zM360 135q-14 13 -14 32t14 32l251 242q14 13 34 13t33.5 -13t13.5 -32t-13 -32l-252 -242q-14 -13 -33.5 -13t-33.5 13z" />
<glyph glyph-name="uniE609" unicode="&#xe609;" horiz-adv-x="1821"
d="M930 377l-251 -242q-14 -13 -34 -13t-34 13t-14 32t14 32l252 242q14 13 33.5 13t33.5 -13t14 -32t-14 -32zM427 441l252 -242q13 -13 13 -32t-13.5 -32t-33.5 -13t-34 13l-251 242q-14 13 -14 32t14 32t33.5 13t33.5 -13z" />
<glyph glyph-name="uniE60A" unicode="&#xe60a;"
d="M1024 288q0 -139 -68.5 -257t-186.5 -186.5t-257 -68.5t-257 68.5t-186.5 186.5t-68.5 257t68.5 257t186.5 186.5t257 68.5t257 -68.5t186.5 -186.5t68.5 -257zM801 498l-365 -366l-156 156l-37 -37l193 -193l403 403z" />
<glyph glyph-name="uniE60B" unicode="&#xe60b;" horiz-adv-x="1344"
d="M1280 236h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5zM1280 -212h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5zM1280 684
h-1216q-27 0 -45.5 18.5t-18.5 45.5t18.5 45.5t45.5 18.5h1216q27 0 45.5 -18.5t18.5 -45.5t-18.5 -45.5t-45.5 -18.5z" />
<glyph glyph-name="uniE60C" unicode="&#xe60c;"
d="M1024 300q0 -139 -68.5 -257t-186.5 -186.5t-257 -68.5t-257 68.5t-186.5 186.5t-68.5 257t68.5 257t186.5 186.5t257 68.5t257 -68.5t186.5 -186.5t68.5 -257z" />
<glyph glyph-name="uniE60D" unicode="&#xe60d;" horiz-adv-x="1685"
d="M1229 -77l289 -135l58 124l-281 131q-21 -54 -66 -120zM944 475v-134h137v258q42 47 62 81l-118 69q-2 -4 -8 -12t-24.5 -30.5t-41 -45.5t-60.5 -54.5t-81 -59.5l75 -114q30 20 59 42zM1524 19v304h-605v-304h137v167h332v-167h136zM1283 169h-137v-66q0 -31 -20 -57.5
t-49.5 -45t-70.5 -34.5t-76.5 -25t-73.5 -17l74 -124q55 14 103 30.5t95.5 43t80.5 58t53.5 75.5t20.5 96v66zM1088 570l31 -133q42 9 85 21q19 -49 59 -78q49 -36 120 -36q45 0 92 14q69 21 133 78l-67 125q-17 -19 -46 -40.5t-60 -31.5q-63 -19 -91 1q-4 3 -8 9
q147 51 240 103l-81 111q-74 -38 -173 -74v85h-137v-129q-50 -14 -97 -25zM755 477v137h-348q11 42 19 84l-134 26q-11 -56 -28 -110h-200v-137h142q-79 -149 -206 -260l90 -103q43 38 85 83v-389h137v165h260v-24h-124l48 -137h83q54 0 92 38t38 92v490h-373q11 22 21 45
h398zM312 134h260v-24h-260v24zM312 295h260v-24h-260v24zM1683 732q0 -33 -22.5 -56t-55.5 -23t-56 23t-23 56t23 55.5t56 22.5t55.5 -22.5t22.5 -55.5zM1545 732q0 -26 17.5 -44.5t42.5 -18.5t41.5 18t16.5 44q0 27 -16.5 45.5t-42.5 18.5q-25 0 -42 -18.5t-17 -44.5z
M1592 691h-17v79q17 2 29 2q18 0 26 -6t8 -17q0 -13 -16 -19v-1q10 -3 14 -19q2 -13 6 -19h-19q-2 3 -6 19q-2 12 -16 12h-9v-31zM1593 735h8q18 0 18 12t-16 12q-6 0 -10 -1v-23z" />
<glyph glyph-name="uniE60E" unicode="&#xe60e;" horiz-adv-x="3958"
d="M611 639h-177l-150 -222l-95 222h-178l168 -395v-2l-31 -243h156l30 231zM699 481q-100 0 -179.5 -72.5t-92.5 -175.5q-13 -105 51 -178q61 -68 157 -68q99 0 178.5 72.5t92.5 175.5q13 104 -51 177q-60 69 -156 69zM759 233q-5 -41 -35.5 -70.5t-68.5 -29.5
q-37 0 -60 27q-27 30 -21 75q5 41 36 70.5t69 29.5q36 0 59 -27q27 -30 21 -75zM1656 481q-100 0 -179.5 -72.5t-92.5 -175.5q-13 -105 51 -178q61 -68 157 -68q99 0 178.5 72.5t92.5 175.5q13 104 -51 177q-60 69 -156 69zM1717 233q-6 -41 -36.5 -70.5t-68.5 -29.5
q-37 0 -60 27q-27 30 -21 75q5 41 36 70.5t69 29.5q36 0 60 -27q26 -30 21 -75zM1332 418q-44 50 -114 50q-51 0 -97 -27l-10 -6l26 204h-156l-80 -640h155l37 288q3 24 22 41t43 17q25 0 40.5 -17.5t11.5 -41.5l-36 -287h156l37 298q10 71 -35 121zM2949 460l-37 -288
q-3 -24 -22 -41t-44 -17q-24 0 -39.5 17.5t-12.5 41.5l37 287h-156l-38 -298q-9 -71 36 -121q43 -50 114 -50q51 0 97 27l9 6l-3 -25h156l58 461h-155zM1951 639l-55 -432h156l55 432h-156zM1970 168q-37 0 -67 -26.5t-34.5 -63.5t18.5 -63q22 -26 59 -26t67 26.5t34 63.5
q5 37 -18 63t-59 26zM2608 178q6 51 -14.5 93.5t-62.5 65.5l-8 5l8 5q39 21 64 57t30 78q8 63 -30 108q-37 44 -97 48l-6 1h-314l-81 -640h317q72 3 128.5 55t65.5 124zM2451 200q-3 -27 -25 -46.5t-50 -19.5h-106l17 134h107q27 -1 43.5 -20.5t13.5 -47.5zM2483 447
q-3 -25 -23 -43t-45 -18h-113l15 124h112q25 0 41.5 -18.5t12.5 -44.5zM3132 -211q65 0 124 37.5t89 99.5l264 534h-156l-127 -258l-63 258h-156l113 -471l-7 -14q-8 -18 -25 -29t-36 -11q-10 0 -20 4l-29 11l-67 -139l29 -10q31 -12 67 -12zM3943 646q0 -65 -45 -110.5
t-110.5 -45.5t-111 45.5t-45.5 111t45.5 110.5t111.5 45q65 0 110 -45t45 -111zM3670 646q0 -52 34 -88t84 -36q49 -1 82.5 35.5t33.5 87.5q0 53 -33.5 89.5t-84.5 36.5q-49 0 -82.5 -36.5t-33.5 -88.5zM3763 566h-35v155q35 5 58 5q36 0 52 -12t16 -34q0 -26 -32 -37v-2
q20 -6 27 -37q5 -26 11 -38h-37q-4 5 -12 38q-4 23 -31 23h-17v-61zM3764 653h17q35 0 35 23t-32 23q-13 0 -20 -1v-45z" />
<glyph glyph-name="uniE60F" unicode="&#xe60f;"
d="M682 74q-108 -89 -249 -89q-107 0 -197.5 53t-143.5 143.5t-53 197.5t53 197.5t143.5 143.5t197.5 53t197.5 -53t143.5 -143.5t53 -197.5q0 -141 -89 -249l286 -286l-56 -56zM433.5 64q130.5 0 222.5 92t92 222.5t-92 223t-222.5 92.5t-223 -92.5t-92.5 -223t92.5 -222.5
t223 -92z" />
</font>
</defs></svg>
... ...
... ... @@ -4,4 +4,11 @@
* @date: 2015/7/13
*/
module.exports = {}
\ No newline at end of file
module.exports = {
bannerTop: {
list: [{
url: '',
img: 'http://img02.yohoboys.com/staticimg/2015/06/30/21/02912cd7f0b2c67939404c71ef00e3f513.jpg'
}]
}
}
\ No newline at end of file
... ...
.banner-top{
height: 309rem / $pxConvertRem;
overflow: hidden;
img{
width: 100%;
height: 100%;
}
}
\ No newline at end of file
... ...
.header{
height: 87rem / $pxConvertRem;
width: 100%;
}
\ No newline at end of file
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #323232), color-stop(1, #414141));
.iconfont {
color: #fff;
}
}
... ...
... ... @@ -46,4 +46,22 @@ a:focus {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-moz-tap-highlight-color: rgba(0,0,0,0);
tap-highlight-color: rgba(0,0,0,0);
}
/*
* 字体图标
*/
@font-face {font-family: 'iconfont';
src: url('../fonts/iconfont.eot'); /* IE9*/
src: url('../fonts/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/iconfont.woff') format('woff'), /* chromefirefox */
url('../fonts/iconfont.ttf') format('truetype'), /* chromefirefoxoperaSafari, Android, iOS 4.2+*/
url('../fonts/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}
.iconfont {
font-family:"iconfont" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
\ No newline at end of file
... ...
@import "common/header";
\ No newline at end of file
@import "common/header", "common/banner-top";
\ No newline at end of file
... ...
{{# data}}
{{> header}}
{{/ data}}
\ No newline at end of file
<div class="mobile-wrap boys-wrap">
{{# data}}
{{> header}}
{{> common/banner_top}}
{{/ data}}
</div>
\ No newline at end of file
... ...
{{# bannerTop}}
<div class="banner-top">
<div class="swiper-container">
<ul class="swiper-wrapper">
{{# list}}
<li>
<a href="{{url}}">
<img class="lazy" data-original="{{img}}" src="{{img}}" alt="">
</a>
</li>
{{/ list}}
</ul>
</div>
<div class="swiper-pagination"></div>
</div>
{{/ bannerTop}}
\ No newline at end of file
... ...
<div class="floor-header">
<h2>{{name}}</h2>
</div>
\ No newline at end of file
... ...
<div class="header clearfix">
<span class="nav-btn"></span>
<span class="search-btn"></span>
<span class="nav-btn iconfont">&#xe60b;</span>
<span class="logo iconfont">&#xe60e;</span>
<span class="search-btn iconfont">&#xe60f;</span>
</div>
\ No newline at end of file
... ...