use*_*967 5 css xhtml webfonts font-face google-webfonts
我有 CSS 和 XHTML 文件。我已经下载了所有 ROBOTO 字体并将其放在我的“webapps/fonts/”文件夹中。
在我的 XHTML 中，我提到了 CSS 路径，
'<link href="../css/tab_ux.css" rel="stylesheet" type="text/css" />'
并且我的 CSS 文件具有类似的样式，
@font-face {
font-family:roboto-bold;
src: url('../fonts/Roboto-Bold.tff') @ttf;
}
.UX_FontClass {
font-family: roboto-bolditalic !important;
font-size : 25px !important;
}
还提到了 XHTML OutputText as styleClass="UX_FontClass "
即使字体在任何浏览器中都不起作用。我的代码做错了什么？或者我错过了什么？
小智 5
你应该使用谷歌字体，它真的很容易使用。
https://www.google.com/fonts#UsePlace:use/Collection:Robot
例子
<head>
<link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
</head>
<body>
<p style="font-family: 'Roboto', sans-serif;">Hello World</p>
</body>
您使用的是自定义字体，因此您还需要添加一些字体类型格式；例如ttf、eot和svg对于 iPhone、iPad 设备。
注意：某些浏览器支持不同的字体类型，这就是您需要
ttf,svg或 的原因eot。
@font-face {
font-family: 'Roboto';
src: url('Roboto-ThinItalic-webfont.eot');
src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('Roboto-ThinItalic-webfont.woff') format('woff'),
url('Roboto-ThinItalic-webfont.ttf') format('truetype'),
url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (under the Apache Software License).
font-weight: 200;
font-style: italic;
}
请记住，之后您需要在类中添加此代码UX_FontClass
.UX_FontClass {font-family: 'Roboto', Arial, Helevtica, sans-serif; }