使用 CSS 自定义网页字体

概述如何使用自定义字体呢？一般的解决办法是把文字体成图片，但是有点麻烦, 不适合我的样的懒人，而且做成图片也不方便修改。还有一种是通过CSS样式定义，我选择了这种, 因为它简单易用，CSS中使用@font-face属性来实现在网页中嵌入任意字体，稍稍复杂一点的问题是每种浏览器都有自己的字体格式要求。 .T…

如何使用自定义字体呢？一般的解决办法是把文字体成图片，但是有点麻烦,不适合我的样的懒人，而且做成图片也不方便修改。还有一种是通过CSS样式定义，我选择了这种,因为它简单易用，CSS中使用@Font-face属性来实现在网页中嵌入任意字体，稍稍复杂一点的问题是每种浏览器都有自己的字体格式要求。

.TTF或.OTF 适用于firefox 3.5、Safari、Opera
.EOT 适用于Internet Explorer 4.0+
.SVG 适用于Chrome、IPhone

方法：

stylesheet.CSS为样式定义(也就是自定义字体部分),

@Font-face {

Font-family: 'Fontname'; /* 字体名称,可自己定义 */

src: url('Fontname.eot');

src: local('Fontname Regular'),

local('Fontname'),

url('Fontname.woff') format('woff'),

url('Fontname.ttf') format('truetype'),

url('Fontname.svg#Fontname') format('svg');

}

将其内容复制到自己的样式表中就可以了,(注意URL部分与自己域空间内字体文件路径相匹配)

/* 使用方法 */

<p style="Font-family: Fontname">Hello World!</p>

这样基本就完成了.

总结

以上是内存溢出为你收集整理的使用 CSS 自定义网页字体全部内容，希望文章能够帮你解决使用 CSS 自定义网页字体所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。