CSS样式基础知识

概述：CSS指层叠样式表 (Cascading Style Sheets)，定义如何在浏览器内显示html元素。添加样式解决了内容与表现分离的问题。可以为多个属性设置同一样式，多个样式可层叠为一。

selector {property: value}

CSS注释语句，用来标明代码作用。

p{
   font-size:12px;/*设置文字字号为12px*/
   color:red;/*设置文字颜色为红色*/
}

<p style="color:red">这里文字是红色。</p>

  <head>
    <style type="text/css">
       p{
        font-size:12px;
        color:blue;
        }
    </style>
  </head>

外部式（外联式）
- css样式写在一个单独的外部文件中，这个css样式文件以.css为扩展名。
- css样式文件名称以有意义的英文字母命名。
- 使用<link>标签将css样式文件链接到HTML文件内，<link>标签写在当前文件的<head>标签中。

  <head>
    <link href="xx.css" rel="stylesheet" type="text/css" />
  </head>

  <head>
    <style type="text/css">
      @import"xx.css"/@import url(xx.css)
    </style>
  </head>

p{color:red!important;}

继承是指一个样式不仅应用于某个特定html标签元素，而且应用于其后代（有一些样式不具有继承性，比如border），即父元素设置样式，子元素可继承部分属性。
层叠就是在html文件中对于同一个元素可以有多个css样式存在，当有相同权重的样式存在时，会根据这些css样式的前后顺序来决定，处于最后面的css样式会被应用，也就是说后面的样式会覆盖前面的样式。
层叠可以理解为：
- 对同一元素或同一文件可以定义多个样式或引入多个样式表。
- 在样式不冲突时，可以把多个样式层叠在一起，应用到元素或文件上。
- 在样式冲突时，按照不同样式规则的优先级应用样式。

!important优先级最高

body {background-image: url(xx.jpg);}

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}