标签：扩展名   文本编辑器   color   inline   http   多个   get   style   css_   

插入CSS的三种方法

有三种方式插入样式表：

• 外部样式表
• 内部样式表
• 行内式样

外部样式表

使用外部样式表，值改变一个文件，您可以改变整个网站的外观！

每个页面必须包含一个外部样式表文件的引用，在 元素里面. 元素包含在 里面:

让我试试

外部样式表可以使用任何的文本编辑器编写。文件不应该包含任何HTML标签。样式表文件必须保存在为一个以.css为扩展名的文件中。

这里是一个CSS文件 "myStyle.css"像这样:

body {
    background-color: lightblue;
}

h1 {
    color: navy;
    margin-left: 20px;
}

注意：不要在属性值和单位之间增加一个空格（margin-left：20 px )正确的方法是：margin-left: 20px；

内部样式表

如果单个页面具有独特的样式，则可以使用内部样式表。

内部样式定义在 元素里面,在HTML的 部分:

让我试试

内联样式

内联样式可用于为单个元素应用唯一样式..

若要使用内联样式，请将样式属性添加到相关元素中。样式属性可以包含任何CSS属性。

面的示例显示如何改变

这是一个标题.

让我试试

提示：内嵌样式失去样式表的许多优点（通过将内容与样式混合）。有节制地使用这种方法。

多个样式表

如果在不同样式表中为同一选择器（元素）定义了某些属性，则将使用最后一次读取样式表的值。

假设一个外部样式表为

h1 {
    color: navy;
}

然后，假设一个内部样式表也为

h1 {
    color: orange;    
}

如果内部样式定义在外部样式之后，那么元素将是"orange".

让我试试

如果内部样式定义在外部样式之前，那么元素将是"navy".

让我试试

级联顺序

当为一个HTML元素指定多个样式时，该如何使用?

一般来讲，我们可以说将样式表"级联"到一个新的"虚拟的"样式表里面去，依据如下优先级规则：

1. 行内式样; (在一个HTML元素内部)
2. 外部和内部样式表 (在 head 部分)
3. 浏览器默认

所以，内联样式（在一个特定的HTML元素）具有最高的优先级,这意味着它将覆盖定义在标签内的样式,或在一个外部样式表,默认值或浏览器.

让我试试
本文转自：http://codingdict.com/article/1947

CSS三种样式

标签：扩展名   文本编辑器   color   inline   http   多个   get   style   css_   

原文地址：https://www.cnblogs.com/bczd/p/12054320.html