4-6. id选择器和类选择器

作者: 一Left一 | 来源:发表于2017-11-17 11:44 被阅读13次

1、id和class的区别?

  • id相当于人的身份证不可以重复

  • class相当于人的名称可以重复

  • 一个HTML标签只能绑定一个id名称

  • 一个HTML标签可以绑定多个class名称

2、id选择器和class选择器区别?
id选择器是以#开头
class选择器是以.开头

3、在企业开发中到底用id选择器还是用class选择器?
id一般情况下是给js使用的, 所以除非特殊情况, 否则不要使用id去设置样式

4、在企业开发中一个开发人员对类的使用可以看出这个开发人员的技术水平
一般情况下在企业开发中要注重冗余代码的抽取, 可以将一些公共的代码抽取到一个类选择器中, 然后让标签和这个类选择器绑定即可。

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        /*
        id和类选择器
        1. 格式: id: #id值 ; 类选择器: .类名
        2. 个数: id: 最多一个; 类: 可以有多个
        3.  应用场景: id 使用较少, 类使用广泛
        */
        .red{
            color: red;
        }
        .ita{
            font-style: italic;

        }
        .size{
            font-size: 10px;
        }
    </style>
</head>
<body>
<p class="red">我是红色</p>
<p class="size">我是10号字</p>
<p class="ita red">我是斜体红色</p>
<p class="size ita">我是10号斜体</p>
</body>
图片.png

相关文章

  • 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...

网友评论

    本文标题:4-6. id选择器和类选择器

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