我(有点尴尬)对font
标记有疑问,以及它如何处理包含连字符的字体名称。
我的朋友在他的网站上有以下字体标记。但它没有在#34;手写 - 达科他"字体。
<font face="Handwriting - Dakota">Hello, World</font>
添加另一层引号修复了问题。这里,face
属性(双引号)由单引号字符串组成。此文本 以Dakota字体呈现。
<font face="'Handwriting - Dakota'">Hello, World</font>
现在,显然正确的做法是将font
标记替换为span
。但我很好奇为什么第一种形式不起作用。根据HTML 4.01规范,face attribute是以逗号分隔的字体名称列表;它没有关于连字符的说法。 CDATA的规范(面部属性的数据类型)也没有。
请注意,它似乎是连字符,而不是空格,导致需要两层引号。 face="American Typewriter"
工作正常。
关于需要第二层引号的连字符的特殊之处是什么?这是否由HTML解析规则引起,该规则适用于除font
标记之外的其他内容(也就是说,在现代HTML中可能遇到类似情况)?
更新:所以Dakota有很多变种,而且名字中都没有连字符。使用{Sntrel上提供的字体Lane可以更可靠地重现该问题。 face="'Lane - Narrow'"
有效; face="Lane - Narrow"
没有。
答案 0 :(得分:1)
face
属性没有特殊的解析规则。如果我们有<font face="'Handwriting - Dakota'">
,则会对其进行解析,以便字体名称为'Handwriting - Dakota'
,并在开头和结尾处将Ascii撇号作为名称的一部分。因此,似乎在您的系统中,字体确实具有这样的名称。
但是,字体名称是一个不起眼的主题,并且在此上下文中没有关于“字体名称”含义的官方定义。在CSS上下文中,在font-family
属性值中,该值原则上是明确定义的(我们可以使用全名或PostScript名称),但浏览器可能不同。
如果系统中的字体与Mac OS相同,则可能带有与字体供应商名称不同的名称。并且在其中带有“ - ”的名称可能会导致浏览器出现问题。可以通过重命名字体来修复它们,但是当其他人查看您的页面时,这将无济于事。如果您发现使用CSS代替修复问题,那么我建议您忘记问题。
我发现discussion似乎意味着供应商(vLetter,Inc)的字体名称是Dakota而他们distribute是免费的(虽然您需要提供个人详细信息;我甚至需要填写“ - ”作为国家)。我下载并在Win 7中以普通字体的形式安装它。它正常工作,包括<font face=Dakota>
和CSS(在Chrome,IE,Firefox上测试)。
使用从供应商网站下载的Dakota并将其用作@font-face
的网络字体可能是最安全的。这样你将使用最新的版本,几乎所有用户都会看到它(与在他们的系统中安装了某些版本的Dakota的相当有限的用户组相反)。
答案 1 :(得分:0)
据我所知,浏览器使用face
标记的font
属性来填充font-family
CSS属性。因此face="'Handwriting - Dakota'"
变为font-family: 'Handwriting - Dakota'
。但是,face="Handwriting - Dakota"
变为font-family: Handwriting - Dakota
,这是无效的CSS。
根据CSS spec:
字体系列名称必须以字符串形式引用,或不加引号作为一个或多个标识符的序列。这意味着每个标记开头的大多数标点字符和数字必须以不带引号的字体系列名称进行转义。
因此,<font face="American Typewriter">
起作用,因为字体名称是CSS标识符的有效序列。但由于裸连字符不是有效的CSS标识符(source),因此字体名称必须是带引号的字符串。 (或者连字符必须被转义;事实证明<font face="Handwriting \- Dakota">
也有效。)同样,<font face="3dumb">
不起作用,因为CSS标识符不能以数字开头。 (3dumb是另一种Font Squirrel字体。)