-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
64 lines (64 loc) · 1.77 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>QQ表情速成版1.0</title>
<meta charset="utf-8" />
<style>
html, body {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
font-size: 0;
text-align: center;
}
canvas, #opt {
float: left;
}
canvas.active {
cursor: move;
}
#opt {
margin-left: 6px;
}
textarea {
width: 200px;
height: 200px;
resize: none;
}
textarea, #color {
display: block;
}
#wrapper {
display: inline-block;
}
.tip {
font-size: 14px;
color: #555;
clear: both;
text-align: left;
}
#font-size, #color {
float: left;
}
</style>
</head>
<body>
<section id="wrapper">
<section class="tip">
<div>1. 支持拖拽上传图片</div>
<div>2. 支持拖拽文字，编辑颜色</div>
<div>3. 右键复制图片，粘贴至QQ输入框即可</div>
</section>
<canvas></canvas>
<section id="opt">
<textarea placeholder="加点文字才有料..."></textarea>
<div id="font-opt">
<input id="color" type="color" value="#ff0000" />
<select id="font-size"></select>
</div>
</section>
</section>
</body>
<script src="index.js"></script>
</html>