24

在 CSS 中，我通常使用通常的

font-family: Arial, Helvetica, sans-serif;

稍微改变一下，我会选择一种看起来像手写的字体。这里的一些 CSS 专家能否建议一些看起来像手写的最安全的字体（在大多数浏览器中最广泛使用）是什么？

4

8 回答 8

28

类似于sans-serif有一个通用cursive的，它是“类似于手写的字体”。这会因浏览器而异（也会有所不同sans-serif），但可能是一个不错的起点。

这是对script每位用户安装的家庭字体的调查（2012 年）：

草书字体采样器和调查结果

它们看起来都彼此显着不同，所以你会失去一些一致性，但有些被广泛采用。

他们安装的主要字体是（仅适用于 WINDOWS）：

Comic Sans MS       99.13%  
Monotype Corsiva    82.29%  
Bradley Hand ITC    63.02% 
Tempus Sans ITC     62.68% 
French Script MT    62.39%
于 2010-04-30T20:52:58.993 回答
5

您可以使用其中一种 Google 网络安全字体：http ://www.google.com/webfonts/family?family=Schoolbell&subset=latin#code

<link href="https://fonts.googleapis.com/css?family=Schoolbell&v1" rel="stylesheet">

h1 {
    font-family: 'Schoolbell', arial, serif; 
}
于 2011-07-02T16:36:46.813 回答
4

在所有平台上的大多数浏览器中都没有可靠可用的手写字体。有像 Windows Vista 或 7 附带的字体这样的子集，但如果您想获得任何可靠的覆盖，您可能不得不求助于在网页旁边提供字体 - 遗憾的是，这使事情变得复杂。

相关的SO问题：

于 2010-04-30T20:53:06.897 回答
1

唯一的网络安全手写字体是Comic Sans - 如果您想将其强加给您的用户。;)

有关百分比，请参阅截至本月的代码风格调查结果：

Windows  99.13%
Mac      89.94%
Linux    60.95%

Linux 上最常见的草书是 URW Chancery L，但它不是跨平台的。

于 2010-04-30T20:53:09.703 回答
1

我想 Comic Sans 或 Lucida 手写将是一些最广泛使用的“手写”字体，尽管它们不是很好的字体。通过查看一些字体嵌入选项，您可能会得到更好的服务，或者使用花哨的 html 5 东西：http ://www.broken-links.com/2009/05/28/exciting-times-html-5- web-fonts/将不完全受支持，或使用基于 Flash 的 sIFR：http: //www.mikeindustries.com/blog/sifr，或这些解决方案的某种组合以覆盖所有用户。

于 2010-04-30T20:53:29.603 回答
1

Comic Sans 将是 Mac 和 pc 中最常见的手写字体，也就是说您始终可以在页面中嵌入字体。

于 2010-04-30T20:55:14.107 回答
1

阅读：http ://www.w3.org/Style/Examples/007/fonts

对于非 js 方式：http ://css-tricks.com/css-image-replacement/

于 2010-04-30T21:00:50.180 回答
0

有一个替代方案。如果您熟悉 Javscript 或 Jquery。有一个非常好的脚本叫做“Cufon”，它做了一个叫做“字体替换”的事情。使用这个简单易用的脚本，您可以在您的网站上使用您想要的任何字体。我建议您首先检查它的文档，然后创建字体的 cufon-js 版本，然后使用它！

使用这样的代码，您将已经在进行字体替换......检查这个简单性

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script src="cufon-yui.js" type="text/javascript"></script>
        <script src="Vegur_300.font.js" type="text/javascript"></script>
        <script type="text/javascript">
            Cufon.replace('h1');
        </script>
    </head>
    <body>
        <h1>This text will be shown in Vegur.</h1>
    </body>
</html>

请访问此网站以获取更多信息： http ://cufon.shoqolate.com/generate/ （这是您可以生成自己喜欢的字体并准备好在您的网站上用作替代品）。记得包含 jquery 文件！

于 2010-04-30T21:52:01.410 回答