如何包含code39字体ttf文件并使用它？

Question

我正在使用code39显示栏codes.but，因为我不能使用下面的code39字体是我的代码。我已将ttf文件包含在字体文件夹中。

@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")

@Styles.Render("~/fonts")

    <table class="table">

        <tr>
            @{
                string size = "0px";
                int co = Model.BarCodeItems.FirstOrDefault().Columns;
                if (co <= 2)
                {
                    size = "90px";
                }
                if (co > 2 || co < 5)
                {
                    size = "70px";
                }
                if (co >= 5)
                {
                    size = "40px";
                }
                int count = 0;
            }
            @foreach (var items in Model.BarCodeItems)
            {


                <td style="text-align:center">
                    <p style="font-family:Code39r;font-size:@size"> @items.BarCode</p>
                    <p> @items.BarCode</p>

                    @*<ol class="" style="width:5px">@items.BarCode.Replace("*", "")</ol>*@

                </td>
                count++;
                if (count == @items.Columns)
                {
                <tr></tr>
                    count = 0;
                }




            }
            </tr>
        </table>

下面是我的包配置，我在bundle config中添加了它，并在我的页面中呈现它。

public static void RegisterBundles(BundleCollection bundles)
    {

        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));
        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.unobtrusive*",
                    "~/Scripts/jquery.validate*"));
        bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
        "~/Scripts/jquery-ui-{version}.js"));
        bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
          "~/Content/themes/base/jquery.ui.datepicker.css"));


        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));


        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));


        bundles.Add(new StyleBundle("~/bootstrap").Include(
            "~/Content/bootstrap.min.css"));

        bundles.Add(new StyleBundle("~/fonts").Include(
            "~/fonts/Code39r.ttf"));


    }

Answer 1

您必须不通过StyleBundle包含字体引用(它不是纯文本文件text/css，而是二进制文件，捆绑一个小型程序不会理解它，它将被错误地包含在<style src="...">标记中)，而是包含在带有@font-face的CSS中。例如，要将其嵌入到HTML代码中：

<style>
    @@font-face {
        font-family: Code39r; src: url('@Url.Content("~/fonts/Code39r.ttf")'); 
    } 
</style>

请注意，@font-face必须转义到@@font-face中(因为Razor将识别@)。如果在CSS中使用它，则不能(除非使用一些技巧)使用Url.Content()解析路径，那么您指定的路径必须相对于您的CSS文件，例如：

@font-face { font-family: Code39r; src: url('../fonts/Code39r.ttf'); }