为文本添加样式(样式化文本) - 学习 Web 开发 编辑

掌握了 CSS 语言的基础之后,对于您来说,下一个需要关心的 CSS 主题就是为文本添加样式——一个您将会最经常使用 CSS 做的事情。在这里,我们专注于为文本样式的基础,包括设置字体、粗细、斜体、行还有字符间距、阴影以及文本的其他特征。我们将会通过在您的网页中应用自定义字体、样式化列表以及链接来圆满地结束本模块。

前提

在开始这一模块之前,您应当像 HTML 介绍 模块中所探讨的,已经熟悉了基本的HTML,以及像 CSS 介绍 中所详述的,对自己的 CSS 基础感觉还满意。

注意: 如果您所使用的是不能创建自己的文件的电脑、平板电脑或其他设备的话,您可以在一个在线编码程序 JSBin 或 Thimble 中尝试(大部分的)代码例子。

导引

这个模块包括了以下文章,这些文章将教会您所有的基本功以支持您为 HTML 文本内容添加样式。

基本的文本以及字体样式
在本文章中,我们将通篇了解文本、字体样式的所有基础,包括设置字体粗细( font weight )、字体系列及样式( family and style )、字体缩写( font shorthand )、文本排列( text alignment )和其他的效果,还有行( line )以及字符间距( letter spacing )。
样式化列表
对于大部分内容来说,列表的行为表现跟其他任何文本其实差不多,但您也需要了解还有一些专门用于列表的 CSS 样式以及考虑一些最好的实践方式。本文章将阐释这一切。
样式化链接
当您为链接添加样式时,很重要的一点是要去理解怎样有效地使用伪类去修饰链接的状态,以及怎么去修饰不同的接口功能例如导航菜单和面板中所使用的链接。我们将会在这篇文章中讨论这些话题。
网络字体
在这里我们将会详细地探索网络字体——这会允许您与您的网页一同下载自定义字体,来实现更为不同的个性化字体样式。

评估

以下的评估将会评测您对以上导引所涵盖的为文本添加样式的技术的理解。

对一个社区学校的主页进行排版
在这个评估中,我们通过让您为一个社区学校的主页添加文本样式来测试您对文本样式的理解程度。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

词条统计

浏览:53 次

字数:3275

最后编辑:7年前

编辑次数:0 次

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文