公众号文章排版学习（五）

CSS 学习

今天是学习公众号文章排版第五天，按照计划今天会学习CSS的基本内容。下面就是具体学习内容。

学习CSS的前提需要对HTML和XHTML有基本的了解。所以还不清楚的，就先去看一下昨天的HTML学习文章。

CSS 指层叠样式表 (Cascading Style Sheets)。样式的作用是定义如何显示 HTML 元素，通常存储在样式表中。外部样式表可以极大提高工作效率，外部样式表通常存储在 CSS 文件中。

通过仅仅编辑一个简单的 CSS 文档，外部样式表使你有能力同时改变站点中所有页面的布局和外观。

当同一个 HTML 元素被不止一个样式定义时，内联样式（在 HTML 元素内部）优先于<head> 标签中的样式声明，优先于外部样式表中的样式声明，优先于浏览器中的样式声明。

这样的话如果我们对一个CSS样式表进行设置后，还是可以具体的再次定义一个具体元素的样式，而不需要对CSS表进行更改。这样就大大的提高了效率。

CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。选择器通常是您需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成。属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。使用花括号来包围声明。

值有不同的写法和单位。比如十六进制、CSS的缩写、数值、百分比。如果值为若干单词，则要给值加引号。如果要定义不止一个声明，则需要用分号将每个声明分开。

最后一条规则是不需要加分号的，因为分号在英语中是一个分隔符号，不是结束符号，但是有经验的设计师会在每条声明的末尾都加上分号，这么做的好处是，当你从现有的规则中增减声明时，会尽可能地减少出错的可能性。应该在每行只描述一个属性，这样可以增强样式定义的可读性。

是否包含空格不会影响 CSS 在浏览器的工作效果，同样，与 XHTML 不同，CSS 对大小写不敏感。不过存在一个例外：如果涉及到与 HTML 文档一起工作的话，class 和 id 名称对大小写是敏感的。

反正HTML和CSS语法的相关信息都尽量使用小写就好了。

你可以对选择器进行分组，这样，被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。

通过 CSS 继承，子元素将继承最高级元素所拥有的属性，如果不希望继承的话创建一个针对 p元素的特殊规则，这样它就会摆脱父元素的规则。

派生选择器允许你根据文档的上下文关系来确定某个标签的样式。通过合理地使用派生选择器，我们可以使 HTML 代码变得更加整洁。

id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。id 选择器以 “#” 来定义。id 属性只能在每个 HTML 文档中出现一次。

在现代布局中，id 选择器常常用于建立派生选择器。

在 CSS 中，类选择器以一个点号显示。类名的第一个字符不能使用数字！它无法在 Mozilla 或 Firefox 中起作用。和 id 一样，class 也可被用作派生选择器。

可以为拥有指定属性的 HTML 元素设置样式，而不仅限于 class 和 id 属性。

当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。

当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表。<link> 标签在（文档的）头部。目前来说我的博客应该需要设置此部分的内容。不要在属性值与单位之间留有空格。

当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使用 <style> 标签在文档头部定义内部样式表。

当样式仅需要在一个元素上应用一次，使用内联样式，你需要在相关的标签内使用样式（style）属性。Style 属性可以包含任何 CSS 属性。

如果某些属性在不同的样式表中被同样的选择器定义，那么属性值将从更具体的样式表中被继承过来。

和昨天一样，还是做一个简单的记录过程。看完了HTML，看CSS会觉得不是那么难以理解。另外就是看完HTML和CSS觉得完全可以应用到博客网页布局和排版中，似乎不仅仅应用于公众号排版，这对我来说也算一个意外的收获了。

希望以上内容对你有所帮助。

今日语录：

一个人只有在全力以赴的时候才能发挥最大的潜能

本文标题：公众号文章排版学习（五）
转载请保留页面地址：https://www.hulklee.com/wechat-article-layout-part-5/