CSS样式核心技术点

一 样式分类

行内样式，内部样式，外部样式。

二 优先级

采用就近原则。

行内样式最近，它的优先级最高。

内部样式或外部样式，看谁离标签近，谁的优先级就高。

三 外部样式导入方式

1 使用 @import url("resource/css/style.css"); 语法导入外部样式

2 使用  导入外部样式

四 实战

1 HTML代码

    
    
    
    
    


我是标题一，采用行内样式，因为我的优先级最高
我是标题二，因为外部样式离我近，所以我显示为蓝色
我是标题三，因为内部样式离我近，所有我显示为绿色

2 CSS代码

h3 {
    color: blue;
}

h2 {
    color: blue;
}

五 效果

六 基本选择器

1 标签选择器

标签 {

    样式:值;

}

2 类选择器

.class名 {

    样式:值;

}

3 id选择器

#id名 {

    样式:值;

}

七 实战

    
    
    


我用的是标签选择器，我显示红色
我用的是类选择器，我显示绿色
我用的是id选择器，我显示蓝色

因为id选择器的优先级高于类选择器，所以我用的是id选择器，我显示桔色
因为类选择器优先级高于标签选择器，所以我用的是类选择器，我显示绿色

八 效果