美文网首页
类选择器和 ID选择器

类选择器和 ID选择器

作者: 一二三开花 | 来源:发表于2017-02-27 10:14 被阅读82次

一、类选择器

语法:

.类选器名称{css样式代码;}

注意:

1、英文圆点开头

2、其中类选器名称可以任意起名(但不要起中文噢)

使用方法:

第一步:使用合适的标签把要修饰的内容标记起来,如下:<span>胆小如鼠</span>

第二步:使用class="类选择器名称"为标签设置一个类,如下:<span class="stress">胆小如鼠</span>

第三步:设置类选器css样式,如下:.stress{color:red;}

/*类前面要加入一个英文圆点*/

二、ID选择器

在很多方面,ID选择器都类似于类选择符,但也有一些重要的区别:

1、为标签设置id="ID名称",而不是class="类名称"。

2、ID选择符的前面是井号(#)号,而不是英文圆点(.)。

三、类和ID选择器的区别

相同点:可以应用于任何元素

不同点:

1、ID选择器只能在文档中使用一次。与类选择器不同,在一个HTML文档中,ID选择器只能使用一次,而且仅一次。而类选择器可以使用多次。

2、可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式,但只可以用类选择器的方法实现,ID选择器是不可以的(不能使用 ID 词列表)。


相关文章

  • css选择器

    目录 1、元素选择器2、选择器分组3、类选择器结合元素选择器使用:多类选择器4、ID选择器ID选择器和类选择器的区...

  • react 开发实战

    CSS:选择器用法:.类名 //类选择器 id名 //id 选择器 .类名 元素名 //后代选择器,包含子元素和子...

  • CSS选择器(1)基本选择器

    选择器 基本选择器 标签选择器 标签{} 类选择器 .类名{} id选择器 id唯一 #id名{} 通配符选择器 ...

  • 类选择器和id选择器的区别

    上面两张图片分别是id选择器和类选择器,二者相似度极高,id选择器的#像是类选择器当中的.,而id选择器当中的id...

  • 学习笔记(css介绍)

    选择器分类 标签选择器 :标签名{......} 类选择器:.类名{......} ID选择器:#id名{.......

  • css选择器

    类选择器 .class ID选择器 #id 元素选择器 p 状态选择器(伪类 ) :status 位置选择器...

  • css选择器平时开发关于id选择器和类选择器的选择的思考

    css中有三种基础的选择器,标签选择器,类选择器和id选择器。 其中标签选择器选择的范围比较广,而类选择器和id选...

  • CSS 选择器

    CSS选择器的概念 标签选择器 类选择器 ID选择器 类选择器与ID选择器的区别 子代选择器 后代选择器 子选择器...

  • jQuery 整理

    样式篇 jQuery选择器 ①id选择器:$( "#id" )②类选择器:$( ".class" )③元素选择器:...

  • 高级选择器及伪类

    高级选择器及伪类 1. 回顾基础选择器 ID选择器 #id 类名选择器 .class 标签选择器 tagna...

网友评论

      本文标题:类选择器和 ID选择器

      本文链接:https://www.haomeiwen.com/subject/hnfzwttx.html