css选择的样式

 

html注释：<!---->    css注释：/**/

 css样式：

1. 行内样式(内联样式)
2. 内部样式表（嵌入样式）
3. 外部样式表
4. 导入式

行内样式不建议大量使用。

内部样式:

 外部样式：

外部样式：

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

优点：

1. Css和HTML分离
2. 多个文件可以使用同一个样式文件
3. 多文件引用同一个css文件，css只需下载一次

css导入式：

 

 

类选择器：

 

 群组选择器：

全局选择器：

后代选择器：

 伪类：

 

 

 

 

 

Css继承和层叠：

继承：

1. 父元素设置样式，子元素可以继承部分属性
2. 减少css代码

1.像border这类的属性不可继承。

div{
    font-size: 12px;
    border: 1px solid red;
}

<div>
    <p>CSS<span>继承</span></p>
    <div>CSS层叠</div>
</div>
<p>CSS继承和层叠</p>

2.假如用body设置整个的页面字体为12px，h1的默认字体为2em,也就是2倍的body字体。

所以h1的字体为24px.说明了当我们上级定义了样式，与我们元素本身默认的样式冲突的时候，这时回忽略继承得来的样式。

层叠：

 css优先级：

优先级结果:id选择器>class选择器>标签选择器。

就近原则 ：使用相同类型（class id）定义样式的时候，并且定义有冲突的时候（都定义颜色），后定义的样式会覆盖之前定义的样式。和在定义class值的时候的先后顺序无关。和定义样式的先后顺序有关。

 

 

 

 

 

 

 

 

 CSS命名规则：