作者:墮天使love蘇蘇_709 | 来源:互联网 | 2023-02-10 19:06
我有一个Angular项目设置与angular-cli.我想将Roboto字体与我的网站捆绑在一起,所以我这样做是因为我在styles.scss中声明它
/* You can add global styles to this file, and also import other style files */
@import url('https://fonts.googleapis.com/css?family=Roboto');
// Set Global Font
body {
font-family: 'Roboto', sans-serif;
margin: 0;
}
但是,似乎字体默认为sans-serif而不是Roboto.我尝试在index.html中添加一个链接,效果相同.
PS不确定是否相关,但我也添加了材料图标
// Import Material Icons
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: local('Material Icons'),
local('MaterialIcons-Regular'),
url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff2') format('woff2'),
url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff') format('woff'),
url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf') format('truetype');
}
在同一个文件中,这可能会对项目产生影响吗?
1> Saiyaff Faro..:
由于您正在处理@ angular/cli项目,我怀疑.scss文件中的链接是否有效.
通过npm安装roboto-fontface并将其链接到angular-cli.json的styles数组中
npm install roboto-fontface --save
在angular-cli.json样式数组'apps [0] .styles'中添加以下内容
"styles": [
...
"../node_modules/roboto-fontface/css/roboto/roboto-fontface.css"
...
]
并且,npm start
尝试风格