使用 javascript 和 jquery 加载外部字体 [英] Load external font with javascript and jquery

问题描述

我有一个 <p > 用 jquery 动态创建的元素，我想用我硬盘上的自定义字体来设计它的样式.

I have a < p > element created dynamically with jquery, and I want to style it with a custom font that I have on my hard drive.

您能否建议我加载该字体并将其应用于该元素的方法.

Could you sugest me a method to load that font and apply it to this element.

现在，对象看起来像:

$("<p>").css({ fontFamily : "Arial",
               fontSize: "13px",
               color: "#000"});

我想用我的自定义字体替换 fontFamily : "Arial".

I want to replace fontFamily : "Arial" with my custom font.

谢谢，加布里埃尔

推荐答案

这段代码完成了所有工作:

This piece of code does all the job:

$("head").prepend("<style type="text/css">" + 
                                "@font-face {
" +
                                    "	font-family: "myFont";
" + 
                                    "	src: local('☺'), url('myFont.otf') format('opentype');
" + 
                                "}
" + 
                                    "	p.myClass {
" + 
                                    "	font-family: myFont !important;
" + 
                                "}
" + 
                            "</style>");

这篇关于使用 javascript 和 jquery 加载外部字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！