css之字体的引用
font-family 属性设置文本的字体系列。
font-family 属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。
注意: 如果字体系列的名称超过一个字,它必须用引号,如Font Family:"宋体"。
多个字体系列是用一个逗号分隔指明:
实例
p{font-family:"Times New Roman", Times, serif;}
如何在css中引入外部字体
css引入外部字体包的方法
@font-face{ font-family: 'oswald'; src : url('..//fonts/oswald.regular.ttf'); }
引入这个字体
.fontFail { font-family: oswald; }
数字使用oswald字体,中文使用思源
body{ font-family: "oswald", "SourceHanSansSC-Light","Source-Han-Light","Source Han Sans CN","SourceHanSansCN-Light","webfontSourceHanSansSC" !important } / oswald字体只有数字和英文,所以汉字就默认使用下面的字体(思源字体) / "SourceHanSansSC-Light","Source-Han-Light","Source Han Sans CN","SourceHanSansCN-Light" / 这个是思源字体的不同写法,为了兼容不同浏览器可以识别该字体 / "webfontSourceHanSansSC" 这个就比较厉害了。 是上面字体包的引用。 如果前面的字体就没找到,就下载这个字体使用。
字体也可以引用不同的文字格式
@font-face { font-family: "SourceHanSansCN-Light"; src: url("../font/SourceHanSansCN-Light.otf"), url("../font/SourceHanSansCN-Light.ttf"); font-family: "SourceHanSansCN-Normal"; src: url("../font/SourceHanSansCN-Normal.otf"); font-family: "SourceHanSansCN-Regular"; src: url("../font/SourceHanSansCN-Regular.otf"); }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现