好玩的css小图标

发布: 2017-01-13 13:21:02标签: css

https://css-tricks.com/snippets/html/glyphs/

01<!DOCTYPE html>
02<html lang='en'>
03
04<head>
05  <meta charset='UTF-8'>
06  <title></title>
07  <style>
08    span:nth-child(1):after {
09      content: "\0026";
10    }
11
12    span:nth-child(2):after {
13      content: "\003c";
14    }
15
16    span:nth-child(3):after {
17      content: "\003e";
18    }
19
20    span:nth-child(4):after {
21      content: "\00a5";
22    }
23
24    span:nth-child(5):after {
25      content: "\00a9";
26    }
27
28    span:nth-child(6):after {
29      content: "\00ab";
30    }
31
32    span:nth-child(7):after {
33      content: "\00bb";
34    }
35
36    span:nth-child(8):after {
37      content: "\00ae";
38    }
39
40    span:nth-child(9):after {
41      content: "\00b1";
42    }
43
44    span:nth-child(9):after {
45      content: "\00d7";
46    }
47
48    span:nth-child(10):after {
49      content: "\2660";
50    }
51
52    span:nth-child(11):after {
53      content: "\2663";
54    }
55
56    span:nth-child(12):after {
57      content: "\2666";
58    }
59  </style>
60</head>
61
62<body>
63  <span></span>
64  <span></span>
65  <span></span>
66  <span></span>
67  <span></span>
68  <span></span>
69  <span></span>
70  <span></span>
71  <span></span>
72  <span></span>
73  <span></span>
74  <span></span>
75</body>
76<script>
77</script>
78
79</html>
复制代码