如题,最近在学习css的时候遇到如下情况
使用@font-face加载多种字体不起作用
反思:是我搞错了,字体加载可能就是要一条一条的写
文件结构目录
代码如下
<!doctype html><head><meta charset="utf-8"><style type="text/css">@font-face{font-family: BOOMBOX;src: url(font/BOOMBOX.TTF);font-family: FZJZJW;src: url(font/FZJZJW.TTF);font-family: LTCH;src: url(font/LTCH.TTF);font-family: ONYX;src: url(font/ONYX.TTF);font-family: ROCK;src: url(font/ROCK.TTF);font-family: TCCM____;src: url(font/TCCM____.TTF);}</style><title>第三次作业</title></head><body><div><footer ><p>字体测试</p><ol><li style="font-family:BOOMBOX">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:FZJZJW">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:LTCH">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:ONYX">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:ROCK">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:TCCM____">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li></ol></footer></div></body>
运行结果
后经过修改
<!doctype html><head><meta charset="utf-8"><style type="text/css">@font-face{font-family: BOOMBOX;src: url(font/BOOMBOX.TTF);}@font-face{font-family: FZJZJW;src: url(font/FZJZJW.TTF);}@font-face{font-family: LTCH;src: url(font/LTCH.TTF);}@font-face{font-family: ONYX;src: url(font/ONYX.TTF);}@font-face{font-family: ROCK;src: url(font/ROCK.TTF);}@font-face{font-family: TCCM____;src: url(font/TCCM____.TTF);}</style><title>第三次作业</title></head><body><div><footer ><p>字体测试</p><ol><li style="font-family:BOOMBOX">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:FZJZJW">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:LTCH">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:ONYX">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:ROCK">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li><li style="font-family:TCCM____">THE QUICK BROwN FOX JUMPS OVER THE LAZY</li></ol></footer></div></body>
结果2如下
如果觉得《@font-face 加载字体引用字体之后不起作用》对你有帮助,请点赞、收藏,并留下你的观点哦!