报错信息显示我引入的模块没有找到,可是我照常引入了style文件夹中的iconfont.css

来源:2-1 flex + iconfont 完成首页 docker 样式编写

Vigorous阿炎

2020-12-23 20:05:23

文件中的内容就是下载下来的两块

@font-face {font-family"iconfont";

    src: url('iconfont.eot?t=1608722723001'); /* IE9 */

    src: url('iconfont.eot?t=1608722723001#iefix') format('embedded-opentype'), /* IE6-IE8 */

    url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAATkAAsAAAAACZwAAASVAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDMgqGNIUvATYCJAMUCwwABCAFhG0HTxtCCFGUL06J7Ick6RghWjwC4AAAiAMcJKAAgB8kQoAIvl9D9324AKOMBvJRGY8oVGxVK12dYyPuiE6bTXwXFEphXkpx8+9SecDYmjMDdBMuwhTlFKFC//umQOmlGf3/947/6PgHa117VE5rbStdGGA0gQIbY+GYwgUUKOXQMHZ5kdsJdJtnDp3uLncYK/R+gXjOEgPjhEGpoEKnuimYWsQPTJ3pWzoDfPc+H//ZRidJzfSdzm+3ESx+eVaZcYulZuzKcDawWWTsAoX4LHQ86wWJXXTd8vf6DoFunZL0yzONZ+vP3tsWKJINqbqNPzxClhSioSt6Ee0wWfgFFiL4pYHI/DJEJH5Vih6MoqLe3egh+ogzoFkd8ocmRUzm/rK6T3TPL1i0TKGn9KbejvuQiOhcAayvlSQ/gSlZ1YjIdAJN7jMkluxRAYLwgkBky/WrcfhK6LBKLJ5QvHpVdOVK/JVr8dLrCWNSZTSpdC3h+vU4NaIzdIf5GsBXNa7GoS4ArHDkivMO4xVYNGGw0+9qT8Jxt+VqUonpKtdd1/xHUYKE3H1Y63q8xHKd6zkiZ8kevLdrv2SfIT+4cohg2znN5PjRZQTRuUqymiS3ntWISxpZSgq7VuIV2Z2rJqXKOV3LlVOkSqOEoPwIYZfJyFyVxDln7FvyJztVcofHAa80QCRtwmlLLl+NkHS1Ebl0paiAl/Sq0ckuex3JpCNtDUVpAwAGbYoSyAos34/nzxvdlR5TBw54dWCKsFuAF9gRFMawP85rdAI7bR9abTC9vMKxe8pLBN78TwfqBZ3eIlbILdt21IFu2gav5HZ51ws2fOo9pr2s8oMbubwm2IfWx00qdDFx93ARZD7TihCbAApvBLW5oimR0Tcdt2/xUjufomJjnu28WsSS7Y4ns6kpeaJcQMQIMf58nwuGOg93E5fCJMj02mDnaOdkWRYcQEu952h7+Di0aW5SE5ImAll1WYGJdYpDc6NDh6qQ4GzytoMPos8XNmrxtAhbLSSN55o2WcrUsPv+SUNbbbGFNXhKph6Y9sD6gX2CZccEClJbiPZknKHORp5RvMQ8Q9lTZ5iXFM9EnqXOMDzD/JFMwTFoBACA/+YZ080J60DuoFPUEbo4tbmP6Gq/WTewc+pxyBC6f+X0PN6KO13Bukj337yZQ6wY4F9Raiz8qXIK0Lb94MS6sRap0BJIzuoyZpDkim78Sp5h94ZRjTXOJHQaiyDpMAdZp1Ws0Hah6rEHjU4H0G1HwOweI6r1ROnCtukAwqD1kPT7Cdmgs1ih3YVq3FtoDEaGbhchv2SP9XiY+ggZpQhff8ws17Fp1qmffaXkXRqJiz36k6TNwhhYWqfTe6pJhhjRfpJQNcZYuMId2I3KkrERzsmqm6o2c88qv+hKruUKpk4IYigSQdn+UBGL1WKnvJpm3n9FEm8lQyqKytxPRLSy5pENS9YNsL2iblR0Ka1rfCRCtVSMe+UTrIL8oY2URoKhyuJOOWIpV2GHWGPOCpXKb6pwp1dV97gBuul71kiRo0SNRn2TiKRb9p+dwVhrRB3Lzb9fyBUBAAAAAA==') format('woff2'),

    url('iconfont.woff?t=1608722723001') format('woff'),

    url('iconfont.ttf?t=1608722723001') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */

    url('iconfont.svg?t=1608722723001#iconfont') format('svg'); /* iOS 4.1- */

  }

  

  .iconfont {

    font-family"iconfont" !important;

    font-size16px;

    font-stylenormal;

    -webkit-font-smoothingantialiased;

    -moz-osx-font-smoothinggrayscale;

  }



http://img.mukewang.com/climg/5fe33261098d2d8909650495.jpg

http://img.mukewang.com/climg/5fe3327209a8157b05260279.jpg

http://img.mukewang.com/climg/5fe3327f097e1d2e08910893.jpg

在这里输入代码,可通过选择【代码语言】突出显示

写回答

1回答

好帮手慕久久

2020-12-24

同学你好,同学@font-face中,字体的路径写的不正确,所以找不到字体。同学的路径,含义是在iconfont.css同级的目录下,找字体文件:


http://img.mukewang.com/climg/5fe3fd4f09da658c09390476.jpg

由于style文件夹中没有字体文件,所以找不到,会报错。

建议将字体改成线上地址(多听一遍视频,视频中老师讲解了如何使用线上字体图标):

http://img.mukewang.com/climg/5fe3fdae095eae8110590261.jpg

关于字体文件的使用,建议同学先严格按照老师的操作步骤来,先学会,再自己拓展(将字体下载到本地,再引入)。

祝学习愉快!

0
higorous阿炎
hp>谢谢,明白了。

h020-12-24
共1条回复

0 学习 · 15276 问题

查看课程