在 CSS 裡自訂向量字型
10 月 03
CSS 技巧 No Comments / 4,228 views
Here is a simple example of how to use web fonts :
@font-face { font-family: "Kimberley"; src: url(http://www.princexml.com/fonts/larabie/kimberle.ttf) format("truetype"); } h1 { font-family: "Kimberley", sans-serif }
Those familiar with CSS syntax will recognize the last line. The @font-face
construct may not be familiar, however it’s easy to explain: as the “Kimberley” font is requested, the font file is fetched from the specified URL. The syntax is described in the CSS2 specification.
To avoid long lists of @font-face
declarations in the style sheet, they can be hidden using @import
:
@import url(http://www.princexml.com/fonts/larabie/index.css) all; h1 { font-family: Goodfish, serif }
The TrueType files used in the examples above are designed by Ray Larabie. He is a renowned font designer who has made hundreds of interesting TrueType fonts freely available for use on the web. His fonts are elegant, decorative, and playful.
Dieter Steffmann is another great font designer. He, too, has made many beautiful fonts available for anyone to use.
在 CSS 裡自訂向量字型,