Question

在VS2010中开设了一个新的asp.net网站（razor v2）网站（仅作为添加自定义字体的测试模板）

将“Gothic.TTd”字体添加为项目级别的“现有项目”。然后在'site.css'中我添加了

@font-face
{
    font-family: "Century Gothic";
    src: url('GOTHIC.TTF'),
}

然后将此字体系列添加到site.css的“body”中，以查看主页上的内容：

body
{
    background-color: #fff;
    border-top: solid 10px #000;
    color: #333;
    font-size: .85em;
    font-family: "Century Gothic", Segoe UI, Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
}

我还缺少什么，如何生成所需的CSS。我正在使用以下教程：

http://markchouanard.com/post/25542393378/using-web-fonts-in-your-asp-net-mvc-application http://www.codeproject.com/Tips/605568/Using-font-face-to-use-custom-fonts-in-web-pages http://weblogs.asp.net/sreejukg/archive/2012/05/23/using-custom-fonts-in-your-web-pages.aspx

有人能建议我现在可以做什么吗？谢谢你的回复

更新的我添加了

<script type="text/javascript" src="GOTHIC.TTF"></script>

到_SiteLayout.cshtml文件......欢迎任何其他想法？

是否需要拥有所有网址（@font-face with embedded font does not work中的示例）我只有.TTF extes：

GOTHIC.TTF
GOTHICB.TTF
GOTHICBI.TTF
GOTHICI.TTF

Answer 1

用逗号替换逗号，并删除font-family名称中的空格。

像这样：

@font-face
{
font-family: "CenturyGothic";
src: url('GOTHIC.TTF');
}

body
{
background-color: #fff;
border-top: solid 10px #000;
color: #333;
font-size: .85em;
font-family: "CenturyGothic", Segoe UI, Verdana, Helvetica, Sans-Serif;
margin: 0;
padding: 0;
}

添加其他网址可让您支持更多浏览器。 .ttf足以让它在谷歌浏览器中运行。

<强>更新

请在“独立”.html文件中尝试使用它，作为一种模板（它对我有用）：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style>
@font-face
{
font-family: "Century";
src: url('GOTHIC.TTF');
}
body {
background-color: #fff;
border-top: solid 10px #000;
color: #333;
font-size: .85em;
font-family: "Century", Segoe UI, Verdana, Helvetica, Sans-Serif;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

如果这不起作用，也许你应该尝试另一个.ttf。你可以在这里找到一个：http://www.1001freefonts.com/snacker_comic.font

将自定义字体添加到VS 2010 @fontface

1 个答案: