#025：文章排版，第一部分 | CSS-Tricks

现在我们有了可以使用的博文区域，我们可以真正深入到博文排版中了。可以说这是网站上最重要的排版，因为读者会在那里花费最多时间阅读。

我们首先考虑标题标签及其大小。然后我们设置<time>元素的样式，它将在整个网站中无处不在。

我们提醒自己，永远不要对小写字母进行字间距，除非你想偷羊。

我们向我们的bits.scss文件中添加了另一个重要的颜色，$blue，它将用于整个网站的链接。我们尝试了一些其他的链接样式，但最终没有采用。悬停/聚焦/活动状态是通过仅使用Sass的Darken()函数实现的。

我们增加了文章第一段的字体大小。这在视觉上很酷，但它也是一个心理技巧，可以让人们阅读并对文章感兴趣。对于我这个作者来说，这也是一个技巧。我知道那一段字体会非常大，所以最好把它写好！

第一段的这个样式可能有点脆弱。例如，我们为将来的Google AdSense广告放置了一个占位符，然后它破坏了选择器。不过我们会修复它！

Matthew

# 2012年9月12日

嗨，Chris，

真的很喜欢这些视频，从工作流程中学到了很多东西。你在Sublime中使用特定的配色方案还是自定义的？

Paul Ciccone

# 2012年9月12日

感谢“上一个视频”和“下一个视频”链接。:) 另外，Vimeo视频对我来说加载速度快了很多。

Angel Paunchev

# 2012年9月13日

为什么不为开头段落使用一个类呢？nth-child有效，但正如你所说，将来事情可能会发生变化，然后你必须更改CSS，而如果你有一个简单的类.lead或类似的东西，你就不需要再碰它了。你甚至可以在网站的其他部分重复使用它。

williammalo2

# 2012年9月18日

你应该使用
h2+time{display:block}
它只在time位于h2之后时才对其进行定位
http://jsfiddle.net/JCSEh/

krompi

# 2012年9月24日

我会为标题-时间组合选择一个标题元素

<article class="module">
 <header>
    <h2>Heading</h2>
    <time>July 30, 2012</time>
 </header>
 <p>...<p>
</article>

是否有任何理由不使用它？

Brian Enriquez

# 2012年10月5日

“你知道你永远不会对小写字母使用字间距，对吧？……除非你想偷羊。”哈哈哈哈哈

lukeluukeluuuke

# 2012年10月14日

我一直在喊着让你使用nth-of-type :P

Tim Smith

# 2019年1月24日

你关于永远不要对小写字母进行间距的评论是什么？关于偷羊的？

评论