CSS:基本选择器中的ID选择器和class选择器的区别

2023-11-16

ID选择器  :  通过标签的id名称来选择标签     # id

类选择器  :  class选择器,选择一个类别      .className

区别:

1.  ID 选择器的是以井号 # 开头来定义的。

     类 选择器是以点 . 来定义的。

2.  ID 选择器在 HTML 中是可以通过 id 属性来使用。

     类 选择器是通过 class 属性来使用的。

3.  同一个页面中一个 ID 选择器只能在中出现一次,是唯一的。

     类 选择器用于描述一组标签的样式,一个选择器可以在多个标签上使用。

     所以 ID 选择器的针对性更强 ,例如:搜索框。

<标签名  id="类名称">标签内容</标签名>

<div  id="box"></div>

<标签名 class="类名称">标签内容</标签名

<div  class="msg"></div>
<div  class="msg"></div>
<div  class="msg"></div>

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

CSS:基本选择器中的ID选择器和class选择器的区别 的相关文章

随机推荐

  • Comparable和Comparator的区别以及Lambda表达式实现

    Comparable和Comparator的区别 1 comparable里面的ComparaTo 是TreeSet和TreeMap里面add 与put 方法里面调用对象的ComparaTo 通过返回值 来确定它 是否存在or顺序 他是内置
  • 计算机二级证书免费发到学校,计算机二级证书去哪里领取

    随着计算机等级考试成为了当代大学生必考的考试之一 越来越多的同学都加入到考试大军 通过了计算机二级考试 证书如何领取呢 下面是小编整理的详细内容 一起来看看吧 计算机二级证书领取方法 1 一般情况下是考试结束后50个工作日左右出成绩及出证
  • echarts 中 symbol 自定义图片

    首先我使用的技术框架的VUE 当然该方法在其他框架也是适用的 这点大家注意一下 在官方文档里面 修改标记的图形 symbol 的方法有三种 一 ECharts 提供的标记类型有 circle rect roundRect triangle
  • .NET C#基础(5):结构体 - 高性能代码的基石

    0 文章目的 本文面向有一定 NET C 基础知识的学习者 介绍C 中结构体定义 使用以及特点 1 阅读基础 了解C 基本语法 了解 NET中的栈与托管堆 2 值类型 2 1 NET的两大类型 在 NET中 所有类型都是object类型的子
  • Excel行高、列宽怎么调整?

    在日常工作中 经常会需要用到Excel表格 如果打开的Excel表格行高列宽不是我们想要的 要怎么调节到合适的大小呢 方法一 打开Excel表格 按 Ctrl A 快捷键 选中全部表格 或者点击表格左上角 行号和列标交汇处的灰色小三角 也可
  • CEPH PG incomplete状态修复

    某运营商的Kubernetes项目物理机停机维护 重启后Kubernetes部分pod无法挂载PVC 请求超时 该Kubernetes集群的后端存储使用ceph rbd块存储 检查ceph集群状态异常 root ceph node01 ce
  • Nacos

    一 Nacos Spring Cloud Alibaba https spring io projects spring cloud alibaba Nacos 官网 https nacos io zh cn docs what is na
  • openGL library下载地址

    GLUT下载页面 http www opengl org resources libraries glut glut downloads php GLUT for Win32下载页面 http www xmission com nate g
  • linux系统虚拟机安装centos7

    一 安装 第一步 下载安装VMware Fusion Mac版本下载后双击安装 这里不做过程记录 第二步 下载CentOS 7安装包 CentOS 7 x86 64 DVD 1810 iso 本文不提供下载地址 第三步 在VMware Fu
  • Vue中使用render 封装el-table解决多级表头自定义模板

    vue中多数情况下使用template封装组件逻辑清晰结构简单 但是在某些情况下 比如非常简单的组件 vue render简单解析或者template无法解决某些场景下 使用完全javascirpt能力就显得尤为重要 文章目录 使用rend
  • VB.Net常用的正则表达式(实例)

    d 非负整数 正整数 0 0 9 1 9 0 9 正整数 d 0 非正整数 负整数 0 0 9 1 9 0 9 负整数 d 整数 d d 非负浮点数 正浮点数 0 0 9 0 9 1 9 0 9 0 9 1 9 0 9 0 9 0 9 1
  • 给定一个存放整数的数组,重新排列数组使得数组左边为奇数,右边为偶数---百度笔试题

    题目 给定一个存放整数的数组 重新排列数组使得数组左边为奇数 右边为偶数 要求 空间复杂度O 1 时间复杂度为O n 我自己写了一下 之前写的那个不对 现在重写了 时间复杂度达到O n void swap int a int i int j
  • python数据可视化-折线图

    可通过ab173 com查看json数据 导入json import json 处理数据 美国为例 f us open D 桌面 折线图数据 美国 txt r encoding UTF 8 us data f us read 美国的全部内容
  • VMware17虚拟机安装及Linux系统搭建(详细版)

    作者简介 大家好 我是小杨 个人主页 小杨 的csdn博客 希望大家多多支持 一起进步呀 前言 VMware是一个虚拟PC的软件 可以在现有的操作系统上虚拟出一个新的硬件环境 相当于模拟出一台新的PC 进行计算机的管理 软件安装 文件的使用
  • 这十个步骤让你的 App 避规ios 4.3被拒问题

    4 3 垃圾应用 请不要为同一个 App 创建多个套装 ID 如果您的 App 针对特定位置 运动队 大学等存在不同版本 请考虑提交单个 App 并提供 App 内购买以提供差异功能 同时 请避免继续在已有大量类似 App 的类别下进行开发
  • kubectl应用

    文章目录 kubectl用法概述 kubectl输出格式 kubectl操作示例 kubectl用法概述 kubectl命令语法 kubectl command TYPE NAME flags 其中 command TYPE NAME fl
  • 如何计算内存大小

    对电子产品 存储介质厂家来说 是按进率1000来计量的 即1000B 1KB 1000KB 1MB 1000MB 1GB 也就是为什么硬盘分区后 会造成缩水 比如80G硬盘实际等于76G 的原因 因为系统是按1024进率来进行分区的 注 我
  • 多文件编程

    文章目录 什么是多文件编程 lt gt 与 多文件编程方法 变量重复定义与头文件重复包含 变量重复定义 头文件重复包含 为什么要避免重复包含 如何解决 1 ifndef 2 pragma once 小总结 什么是多文件编程 多文件编程 指的
  • vite postcss

    PostCSS PostCSS是一款使用JavaScript插件对CSS实现转换的工具 PostCSS拥有非常强大的插件 典型的比如autoprefixer cssnext css modules等 PostCSS插件的处理方式类似CSS预
  • CSS:基本选择器中的ID选择器和class选择器的区别

    ID选择器 通过标签的id名称来选择标签 id 类选择器 class选择器 选择一个类别 className 区别 1 ID 选择器的是以井号 开头来定义的 类 选择器是以点 来定义的 2 ID 选择器在 HTML 中是可以通过 id 属性