Question

我正在为某些文字应用自定义非英语非unicode字体。

在某些情况下，这可能包含英文文本。在这种情况下，此英文文本包含在字体标记内，如下所示：

<small><font face="Arial,Helvetica">Some sample text</font></small>

我使用以下内容应用字体：

@font-face {
     font-family: "my_custom_font";
     src: url(static/fonts/my_custom_font.woff);
}

.my_font {
    font-family:"my_custom_font";
    font-size:180%;
}

当我将此字体应用于div时，它会按预期显示

<div class="my_font">

<?php print_r($data["title"]); ?>

</div>

然而，当我对输入字段执行相同操作时，我得不到相同的结果

<input name="title" class="my_font" value="<?php echo htmlspecialchars($data["title"]);  type="text">

不是按预期使用英语呈现文本，而是将字体应用于HTML标记，从而产生垃圾字符。如果我不使用htmlspecialcharacters，那么输入字段会在“after'sface”出现时终止

是否可以将输入字段视为div？

Answer 1

首先不要使用字体标记。

不要使用此元素！虽然曾经在HTML 3.2中进行了规范化，但确实如此   在HTML 4.01中弃用，与所有相关的元素同时使用   仅限样式，然后在HTML5中废弃。

从HTML 4开始，HTML不再传达样式信息   （在元素之外或每个元素的style属性）。   对于任何新的Web开发，样式应仅使用CSS编写。

然后在输入字段中，您将错过关闭php代码。它应该是

<input name="title" class="my_font" value="<?php echo htmlspecialchars($data["title"]); ?>" type="text">

为页面上使用的字符集添加元标记

<meta charset="utf-8">

是的，您可以根据自己的喜好设置输入字段的样式。

.my_font {
    font-family:"my_custom_font";
    font-size:180%;
}

Answer 2

使用contenteditable div渲染文本和隐藏的表单元素来存储其值解决了我的问题。

将字体应用于带有HTML字符和标记的输入字段中的文本

2 个答案: