编辑“WordPress:Playing With Fonts”

==字体代表你的内容==

毫无疑问，你的表述，你的文章是你的博客，或者站点中最重要的东西。这些表述，和你的可爱的[[WordPress:Developing_a_Colour_Scheme|颜色]]和图画，表述了你的站点的故事。但是，别忘了，关注你的字体选择。你在[[WordPress:Theme Development|设计你的主题]]中选择的字体，可以影响到人们会不会逗留在网页上，访问不止一两页你的优秀的作品。

字体有许多不同的样式和形式，但是不幸的是，除非用户真的将那个字体安装在他们的机器上，要不然的话，他们只看到一些"关闭"的字体，例如你想显示的一般的衬线字体和非衬线字体。如果你想看看你安装在机器上的字体列表，你可以访问下面所列的几个字体站点，或者这个[http://www.cameraontheroad.com/index.php?p=524 字体测试]。如果你的字体在那儿，你就能看到。如果你的字体没有在那儿显示，你能看到一个一般的Courier字体。
在你的[[WordPress:Using_Themes|主题的]]样式表(通常是<tt>style.css</tt>)，你可以控制字体名称属性（要显示的字体列表），颜色，大小，以及你的字体的其它方面。下面的例子设置了你的工具条菜单上的字体，将大小设置为<tt>1em</tt>高，将颜色设置为蓝色：

<pre>#菜单 {font-family: Verdana, Arial, Helvetica,
   sans-serif; font-size:1em; color:blue; }</pre>

就如你所见到的那样，你在字体名称属性中设置了不止一个字体。如果用户没有Verdana, Arial就会起作用。如果Verdana和Arial都没有，他们就有机会使用Helvetica。如果其它的都没有，用户的系统字体会起作用，为<em>sans-serif</em>使用默认的字体。这个选择列表帮助设计者控制字体，并且确保一个更加一致的"外观和给人的感觉"。
Font families tend to be single words, but on occasion you will find a phrase to represent a font such as <em>Lucida Console</em>.  This is set in the style selector surrounded with quote marks such as:
字体名称属性倾向是一个单词，但是有时，你可以看到一个词组代表一个字体，例如<em>Lucida Console</em>。这个在引号中，设置在样式选择器中，例如：

<pre>#menu {font-family: Verdana, Arial, Helvetica, 
     "Lucida Console", sans-serif;.....</pre>

== WordPress中的字体==

[[WordPress:Using Themes|WordPress 主题]]以许多不同的方法使用主题，而且这些使用方法并不总是一致的。它取决于作者的决定以及设计主题的需求。网站上的不同位置能够找到不同的字体，一种字体在页眉上，另一种在工具条（或者可能是另两种或者三种），还有一种字体样式或者形式出现在文章内容区。找到这些字体，并且更改，会使用户悲痛。

因为字体可能在任何weiz ，找到你想要更改的字体，会是一个挑战。一般来说，全部的字体都设置在一个站点的<tt>body</tt>。

<pre>body {font-family: Verdana, Arial, Helvetica, 
     Futura, sans-serif; 
     font-size: 1em; 
     padding:0; 
     margin:0; }
</pre>

这包括了在站点内部发现的字体的定义，没有一个特别的标签，或者分类，或者div定义这个字体。它是"后退字体"。

在一个站点的页眉内部发现的字体通常可以在<tt>header</tt> div内部发现，对于<tt>sidebar</tt> 或者 <tt>menu</tt> 和<tt>footer</tt>样式层也是同样的。但是，要追溯到内容可能就更加具有挑战性了。

文章内容中的字体通常可在以下的CSS分类中找到，但是并不总是这样：
*内容
*文章
*条目
*文章条目

可能在具体的类别或者在一个段落标签中有字体信息。

<pre>.content p { margin:5px;
    padding:5px;
    font-family: Tahoma, Verdana, Helvetica, sans-serif; 
    font-size: 110%;
    color: black; }
</pre>

<tt>sidebar</tt>或者 <tt>menu</tt>嵌套列表内部的字体，很难减少。关于许多WordPress站点内部的所有嵌套列表的一步步的指导，请看[[WordPress:Styling Lists with CSS|CSS设计列表]]。

如果找到一个特别的字体代码时，你仍然有困难，考虑使用一些[[WordPress:Finding Your CSS Styles|找到你的CSS样式]]中的一些小贴士和方法。

==哪个字体==

决定你的站点使用哪种字体最好，是一个个人的选择，但是有一些文章会帮助你决定。我们推荐你开始时，使用一些大多数人的电脑上常见的，阅读起来比较简单的字体。

===字体调查===

找出哪种字体是最受欢迎的，查看一下以下的内容：

* [http://www.codestyle.org/css/font-family/sampler-WindowsResults.shtml Codestyle's Windows 万维网字体调查结果]

* [http://www.codestyle.org/css/font-family/sampler-CombinedResults.shtml Codestyle的所有平台的字体调查]

* [http://www.webstyleguide.com/type/face.html 万维网样式指南: 字体]

===字体大小===

你可以更改你的访客看到的字体大小。在打印机时代，即使是在如今的文字处理软件和桌面出版软件，"磅"系统仍然在使用中。你应该熟悉"12pt Times Roman" 和"8pt Arial"。在网页上磅值使用得并不好，因为大多数浏览器不能翻译什么是一"磅"。浏览器能够理解像素和一个基本大小的百分比，但是不同的浏览器对于打印机磅值的翻译都是不同的。你可以使用磅值，但是你也有更好的选择。

你可以把字体设置为绝对的，这指的是，字体的大小是固定的，但是那样也有缺点。绝对字体大小的问题在于，如果一个用户将他们的浏览器设置为"看到"更大的字体('''浏览 > 文本大小''')或者使用一个特别的软件来[http://www.w3.org/WAI 视觉上或者物理上的缺陷]，你可能要剥夺他们的权利"看"更大的字体。如果你将字体设置为一个规定的大小，以适应你的布局，确定对于站点上更加重要的信息，你没有使用那个字体。下面的例子显示了怎样设置一个完全的字体大小：

#菜单 ul li {字体大小: 12px; 颜色: 绿色; }

一个更通用的方法是在为整个文章设置字体大小，然后从那儿将每个部分字体以一个相关的大小为基础。一个基本字体的百分比也得到了使用，允许字体以用户的喜好为基础，重新调整大小：

<pre>body { font-size: 1em; }
#menu ul li { font-size: 110%; color: green; }</pre>

===字体和文本特征===

你设置字体时，会有许多有趣的事情！你可以将字体设置为斜体的，你可以将它们设置为粗体的，你也可以将段落的第一个字母设置的比文章中其它的字母大。字体的变化列表是接连不断。这个课程只是怎样设置你的WordPress站点的形式和大小的匆匆一瞥。还有更多的知识关于使用哪一个字体，怎样使用字体，使用多少字体，什么字体，还有…恩，你的站点上哪一个字体看起来是最好的。而且不同的浏览器也以不同的方式翻译字体。你可以找到更多的信息来帮助你，完成下面的字体设置。

==字体资源==

* [http://www.thenoodleincident.com/tutorials/css/index.html#text  Noodle Incident的CSS 和文本Text]
* [http://www.w3schools.com/css/css_font.asp W3 Schools: CSS 字体]
* [http://webdesign.about.com/cs/webdesignfonts/a/aa051903a.htm About.com的万维网设计 (CSS): 什么是一个字体]
* [http://www.thenoodleincident.com/tutorials/typography/index.html Noodle Incident的 印刷样式指南]
* [http://www.htmlhelp.com/reference/css/font/ HTMLHelp的 字体特性]
* [http://www.yourhtmlsource.com/text/textformattinglist.html HTML 原始资料: 文本样式]
* [http://webdepot.umn.edu/csguide/design_b.html 明尼苏达州大学的创造性标准指南: 文本和字体]
* [http://desktoppub.about.com/library/nosearch/bl-fewerfonts.htm About.com的万维网设计:多少个字体是太多了]
* [http://www.font-finder.com/fonts.html字体-探测器]
* [http://www.thinkingwithtype.com/ 思考类型]
===字体大小资源===

* [http://www.w3.org/2003/07/30-font-size W3c的关注字体大小]
* [http://www.alistapart.com/stories/sizematters/ CSS 一个分开的列表:大小问题]
* [http://www.bigbaer.com/css_tutorials/css_font_size.htm BIG BAER 解释 CSS 字体大小]
* [http://www.miswebdesign.com/resources/articles/using-relatve-font-sizes.html MIS: 使用相关的字体大小]
* [http://www.wilk4.com/webdevres/fontcss3.htm WebDevRes: CSS 字体大小控制和建议]

===发现并解决字体问题===
* [http://css-discuss.incutio.com/?page=BrowserBugs Internet Explorer 字体大小程序错误]
* [http://archivist.incutio.com/viewlist/css-discuss/33917 Internet Explorer Font Size 遗产]