CSS||选择器

CSS||选择器_第1张图片

目录

作用

分类

基础选择器

标签选择器

​编辑类选择器

id选择器 

通配符选择器


作用

选择器(选择符)就是根据不同需求把不同的标签选出来这就是选择器的作用。  简单来说,就是选择标签用的。

CSS||选择器_第2张图片

 选择器的使用一共分为两步:

1.找到需要定义的标签

2.设置这些标签的样式

分类
基础选择器

由单个选择器组成

标签选择器

用HTML标签名称作为选择器,按照标签进行分类,为页面中某一类标签指定统一的CSS样式




    
    
    myweb
    


    

HELLO WORLD

 运行结果:

CSS||选择器_第3张图片类选择器

如果想要差异化选择不同标签,单独选择一个或者几个标签,可以使用类选择器

结构需要用class属性来调用class类的意思

样式点定义 结构类(class)调用 一个或多个 开发最常用

  • 类的名字由我们自己定义(不能用已知标签名字)
  • 多个单词用短横线来分割
  • 不要出现纯数字,中文等命名,尽量使用英文字母来表示
  • 命名要有意义



    
    
    myweb
    


    

HELLO WORLD

young man

运行结果: 

CSS||选择器_第4张图片

 类选择器-多类名

我们可以给一个标签指定多个类名,从而达到更多的选择目的,这些类名都可以选出这个标签,简单理解就是一个标签有多个名字




    
    
    myweb
    


    
HELLO WORLD

 在标签class属性中写多个类名

在多个类名中间必须用空格分开

id选择器 

id选择器可以为标有特定id的HTML元素指定特定的样式

HTML元素以id属性来设置id选择器,CSS中id选择器以“#”来定义

注:只能调用一次

#id名{
    属性1:属性值1;
}



    
    
    myweb
    


    
HELLO WORLD
通配符选择器

在CSS中,通配符选择器使用“*”定义,它表示选取页面中所有元素

你可能感兴趣的:(css,前端)