@font-face { font-family: 'MyFont'; /* 定义字体名称 */ src: url('MyFont.ttf') format('truetype'); /* 引入字体文件地址 */ }
以上代码表示在CSS中简单地定义了一个字体,并将其命名为“MyFont”,同时引入了一个名为“MyFont.ttf”的字体文件。在网页中需要使用这个字体时,可以通过将font-family属性设为“MyFont”来调用它。这样做的好处是,即使用户的电脑没有安装这个字体文件,网页也能够正常地显示这个字体。
除了使用.ttf格式的字体文件外,font-face还可以支持一些其他格式的字体文件。例如,下面代码可以引入一种名为“MyFont.woff”的字体文件:
@font-face { font-family: 'MyFont'; src: url('MyFont.woff') format('woff'); }
可以看出,font-face规则非常灵活,可以简单地定义和使用自定义字体。在网页中使用自定义字体可以使得设计更加丰富和个性化,但是同时也需要考虑字体的版权问题,不能随意使用他人的版权字体。