http://www.runoob.com/css/css-id-class.html

http://www.w3school.com.cn/css/css_syntax_id_selector.asp

http://www.w3school.com.cn/css/css_syntax_class_selector.asp

如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器。

id选择器

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

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

注意:id 属性只能在每个 HTML 文档中出现一次。

class选择器

class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。

class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示:

样式的优先级

关于样式的优先级,就目前测试来看,id selector的优先级高于element selector

https://github.com/ChuckTest/CSSTest/blob/master/Project/Pages/main.html

https://github.com/ChuckTest/CSSTest/blob/master/Project/Styles/main.css

Id选择器和Class选择器的更多相关文章

  1. id选择器、类选择器、属性选择器

    在网页编辑时,通常要对样式进行各种设置.我们借助CSS样式设计中的选择器,就能很好很方便的对它们进行管理和设置了. 今天,跟大家分享一下几个常用的选择器:id选择器.类选择器.属性选择器. id选择器 ...

  2. css笔记08:id选择器之父子选择器

    1.父子选择器 (1)01.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  3. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

  4. jquery基本选择器:id选择器、class选择器、标签选择器、通配符选择器

    全栈工程师开发手册 (作者:栾鹏) jquery系列教程1-选择器全解 jquery基本选择器 jquery基本选择器,包括id选择器.class选择器.标签选择器.通配符选择器,同时配合选择器的空格 ...

  5. H5 id选择器和class选择器

    11-id选择器和class选择器 第一段文字 第二段文字 第三段文字 --> 第一段文字 第二段文字 第三段文字 <!DOCTYPE html> <html lang=&qu ...

  6. 课时70.id选择器和类选择器(理解)

    1.id和class的区别? id相当于人的身份证不可以重复 class相当于人的名称可以重复 1.2 一个HTML标签只能绑定一个id名称 一个HTML标签可以绑定多个class名称 2.id选择器 ...

  7. 请写出css中选择器(元素选择器、类选择器、id选择器)的优先级顺序,和当各种选择器组合时,优先级的计算规则是什么?

    id选择器>类选择器>元素选择器 规则:选择器的权重值表述为4个部分,用0,0,0,0表示. 通配符*的权重为0,0,0,0 标签选择器.伪元素选择器的权重为0,0,0,1 类选择器.属性 ...

  8. CSS ID选择器&通配选择器

    ID选择器 ID(IDentity)是编号的意思,一般指定标签在HTML文档中的唯一编号.ID选择器和标签选择器.类选择器的作用范围不同. ID选择器仅仅定义一个对下对象的样式,而标签选择器和类选择器 ...

  9. CSS选择器(通配符选择器、标签选择器、类选择器、id选择器、群组选择器、后代选择器、子元素选择器和相邻元素选择器)

    通配符选择器  *   与任何元素匹配 派生选择器: 后代选择器(包含选择器):后代选择器可以选择作为元素后代的元素 A B    对A元素中的B元素应用样式 后代选择器中两个元素间的层次间隔可以是无 ...

  10. HTML+CSS教程(四)选择器(id选择器,类选择器,标签选择器,子代选择器,后代选择器,组选择器,伪类选择器)/css引入页面的形式(行内样式、内嵌样式、外联样式)

    一.回顾内容 前端的三大组成(三大模块)    HTMl(超文本标记语言) 结构层    css(层叠样式表) 表现层:用来美化HTML结构    JS(Java script)(脚本语言) 行为层: ...

随机推荐

  1. PHP XML To Array将XML转换为数组

    // Xml 转 数组, 包括根键,忽略空元素和属性,尚有重大错误 function xml_to_array( $xml ) { $reg = "/<(\\w+)[^>]*?& ...

  2. 51nod 1325 两棵树的问题(最大权闭合子图)

    首先如果点权全都为正,就可以直接选所有的点. 活在梦里.. 考虑枚举一个点\(i\),作为我们选择的集合中的一个点. 然后我们把另一个点\(j\)选入集合的时候必须把两棵树中\(i\)和\(j\)路径 ...

  3. Python学习————列表的增删改查

    增加:li.append(对象):追加 注:print(li.append())--->是Noneli.insert(索引,对象):插入到相应位置li.extend(对象):可迭代的添加到尾部, ...

  4. HTTP——学习笔记(6)https

    HTTP+加密+认证+完整性保护=HTTPS HTTP是一种新协议吗?: 不是,HTTPS只是HTTP通信接口部分用SSL和TLS协议代替而已 HTTP中,身处应用层的HTTP直接和TCP通信.而在使 ...

  5. 过Hard题目.周末

      # Title Editorial Acceptance Difficulty Frequency   . 65 Valid Number     12.6% Hard    . 126 Word ...

  6. 转:app store 注册账号生成证书上传app完整的教程

    app store为开发者提供四种类型的申请: 个人ios开发者计划$99/年 公司ios开发者计划$99/年 企业ios开发者计划$299/年 高校ios开发者计划免费 在这里主要介绍一下公司ios ...

  7. Java transientkeyword使用小记

    1. transient的作用及用法 我们都知道一个对象仅仅要实现了Serilizable接口,这个对象就能够被序列化,java的这样的序列化模式为开发人员提供了非常多便利.我们能够不必关系详细序列化 ...

  8. pandas dataframe 做机器学习训练数据=》直接使用iloc或者as_matrix即可

    样本示意,为kdd99数据源: 0,udp,private,SF,105,146,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0.00,0.00,0.00,0.00,1.0 ...

  9. 熟悉了下HTTP协议

    HTML是一种用来定义网页的文本,会HTML,就可以编写网页: HTTP是在网络上传输HTML的协议,用于浏览器和服务器的通信.200表示一个成功的响应,后面的OK是说明.失败的响应有404 Not ...

  10. react ---- Router路由的使用和页面跳转

    React-Router的中文文档可以参照如下链接: http://react-guide.github.io/react-router-cn/docs/Introduction.html 首先,我们 ...