|
|
@@ -0,0 +1,57 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+ <style>
|
|
|
+ /* font-face 引入字体 */
|
|
|
+ @font-face {
|
|
|
+ /* 引入的字体名称 */
|
|
|
+ font-family: "iconfont";
|
|
|
+ /* Project id 5060986 */
|
|
|
+ /* 字体文件地址 */
|
|
|
+ src: url('https://at.alicdn.com/t/c/font_5060986_6o3jugyk9qc.woff2?t=1762667239058') format('woff2'),
|
|
|
+ url('https://at.alicdn.com/t/c/font_5060986_6o3jugyk9qc.woff?t=1762667239058') format('woff'),
|
|
|
+ url('https://at.alicdn.com/t/c/font_5060986_6o3jugyk9qc.ttf?t=1762667239058') format('truetype');
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 可以理解为一个工具类 ,谁想使用这个字体图标,就给谁添加这个类名 */
|
|
|
+ .iconfont {
|
|
|
+ /* 使用的字体名称 */
|
|
|
+ font-family: "iconfont" !important;
|
|
|
+ font-size: 16px;
|
|
|
+ /* 字体样式 normal 以正常的文字效果展示*/
|
|
|
+ font-style: normal;
|
|
|
+ /* 开启字体平滑渲染 */
|
|
|
+ /* -webkit- 内核 常见的有 chrome safari */
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+ /* -moz- 内核 常见的有 firefox */
|
|
|
+ -moz-osx-font-smoothing: grayscale;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon-attachment:before {
|
|
|
+ content: "\e6a9";
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon-tupian:before {
|
|
|
+ content: "\e621";
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon-yuyin:before {
|
|
|
+ content: "\e8c0";
|
|
|
+ }
|
|
|
+ .text1{
|
|
|
+ color: blue;
|
|
|
+ font-size: 100px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <i class="text1 iconfont icon-yuyin"></i>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|