-
Notifications
You must be signed in to change notification settings - Fork 0
/
sprite.html
115 lines (105 loc) · 3.25 KB
/
sprite.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>sprite picture</title>
<link rel="stylesheet" href="/css/bootstrap.min.css">
<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<style type="text/css">
.forspirit{margin-top: 30px;}
ul{list-style: none;padding:0;}
li h3{font-size: 18px;font-weight: 400;margin: 0;padding:0;line-height: 31px;}
li{
display: block;
height: 31px;
line-height: 31px !important;
overflow: hidden;
border-bottom: 1px solid #dedede;
}
.cat{width: 200px;background-color: #f8f8f8;border: 1px solid #bbb;margin: 0 auto}
li i{background: url(http://img.mukewang.com/539a950e00015ba500710200.jpg);width: 30px;height: 22px;float: left;line-height: 31px;margin-top: 5px;}
.cat-1 i{background-position: 0 0;}
.cat-2 i{background-position: 0 -24px;}
.cat-3 i{background-position: 0 -48px;}
.cat-4 i{background-position: 0 -72px;}
.cat-5 i{background-position: 0 -96px;}
.cat-6 i{background-position: 0 -120px;}
.cat-7 i{background-position: 0 -144px;}
.cat-8 i{background-position: 0 -168px;}
.cat-9 i{background-position: -40px 0px;}
</style>
<style type="text/css">
input[type=text]{margin: 10px 0;width: 100%;font-size: 24px;}
input[type=checkbox]{margin: 6px 5px 0 0;padding: 0;float: left}
.wrap{width: 219px;background-color:lightblue;margin: 0 auto;padding:15px;}
.wrap hr{margin-top: 15px;margin-bottom: 15px}
.smalltext{font-size: 12px;}
#autologin{float: left}
#forgetpwd{color: blue;float: right;}
#login,#signup{background: url(http://img.mukewang.com/539a972b00013e9102280177.jpg);display:block;width: 189px;height: 38px;margin-top: 5px}
#login{background-position: 0 0; }
#signup{background-position: 0px -38px; }
.gg{height: 25px;line-height: 25px;}
</style>
</head>
<body>
<div class="container forspirit">
<div class="row">
<div class="col-sm-6">
<div class="cat">
<ul>
<li class="cat-1 ">
<i></i>
<h3>服装内衣</h3>
</li>
<li class="cat-2">
<i></i>
<h3>鞋包配饰</h3>
</li>
<li class="cat-3">
<i></i>
<h3>运动户外</h3>
</li>
<li class="cat-4">
<i></i>
<h3>珠宝手表</h3>
</li>
<li class="cat-5">
<i></i>
<h3>手机数码</h3>
</li>
<li class="cat-6">
<i></i>
<h3>办公家电</h3>
</li>
<li class="cat-7">
<i></i>
<h3>护肤彩妆</h3>
</li>
<li class="cat-8">
<i></i>
<h3>母婴用品</h3>
</li>
<li class="cat-9">
<i></i>
<h3>其他分类</h3>
</li>
</ul>
</div>
</div>
<div class="col-sm-6">
<div class="wrap">
<input type="text" name="name" placeholder="邮箱/手机号/用户名"><br>
<input type="text" name="pwd" placeholder="请输入密码">
<div class="gg">
<input type="checkbox" name=""><span id="autologin" class="smalltext">下次自动登陆</span><a href="#"><span class="smalltext" id="forgetpwd">忘记密码？</span></a>
</div>
<button id="login"></button><hr>
<button id="signup"></button>
</div>
</div>
</div> <!-- row end... -->
</div>
</body>
</html>