一、外部样式表 外部样式表是最理想的 CSS 引入方式。在实际开发中,为了提升网站的性能速度和可维护性,一般都是使用外部样式表。所谓的外部样式表,指的是把 CSS 代码和 HTML 代码都单独放在不同文件中,然后在 HTML 文档中使用 link 标签来引用 CSS 样式表。 当样式需要被应用到多个页面时,外部样式表是最理想的选择。使用外部样式表,你就可以通过更改一个 CSS 文件来改变整个网站的外观。 在 HBuilder 创建一个 CSS 文件很简单,就像创建 HTML 文件一样。如果不知道怎么创建的,自己摸索一下或者搜索一下。 外部样式表在单独文件中定义,然后在 HTML 文件的标签对中使用 link 标签来引用。 语法:
< link rel =" stylesheet " type =" text / css " href ="文件路径”/> rel 即 relative 的缩写,它的取值是固定的,即 stylesheet ,表示引入的是一个样式表文件(即 CSS 文件) o
type 属性取值也是固定的,即" text / css ",表示这是标准的 CSS 。 href 属性表示 CSS 文件的路径。对于路径,相信小伙伴们已经很熟悉了。 如果小伙伴们记不住这一句代码也没关系, HBuilder 有着非常强大的代码提示功能。
举例: <! DOcTYPE htm1> < html > < head > < meta charset =" utf -8"/> < title ></ title > < link rel =" stylesheet ” type =" text / css " href =" Css / index . Css "/></ head > < body > </ body >
分析: 如果你使用外部样式表,必须使用 link 标签来引入,而 link 标签是放在 head 标签内的。 二、内部样式表 内部样式表,指的是把 HTML 代码和 CSS 代码放到同一个 HTML 文件中。其中, CSS 代码放在 style 标签内,并且 style 标签是放在 head 标签内部的。