最近的项目要自己写前端了，重新学习下前端的一下基本知识。

一般在css样式表中，上面的会被下面的覆盖，如下图，文字会显示蓝色：

所以按照正常的来说，下面的css样式，测试的文字应该还是蓝色

但结果，测试文字显示黄色，标签选择器的结果被属性选择器覆盖了，起作用的是属性选择器

结论：id选择器的权重>class选择器的权重=属性选择器的权重>元素选择器（id选择器和class选择器可以自行验证），

一般相等权重的按位置覆盖，不同权重的选择器，位置变了也不会覆盖

css：id选择器的权重>class选择器的权重=属性选择器的权重>元素选择器的更多相关文章

  1. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  2. CSS选择器之通配符选择器和多元素选择器

    1.通配符选择器 如果希望所有的元素都符合某一种样式,可以使用通配符选择器． 基本语法: *{margin:0; padding:0} 可以让所有的html元素的外边距和内边距都默认为0. 写一段ht ...

  3. 从零开始学习jQuery-------jQuery元素选择器(三)

    下面我们来介绍一下jQuery元素选择器,在Web开发中我们最常用的操作是获取元素,然后对获取的元素进行一系列的操作,jQuery根据获取页面元素的不同,可以将jQuery选择器分为四大类:基本选择器 ...

  4. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  5. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

  6. CSS ID选择器(三)

    一.ID选择器 ID选择器使用"#"前缀标识符进行标识,后面紧跟指定的元素的ID名称. 如 #box{ width:100px; height:100px;} 元素的ID名称是唯一 ...

  7. CSS Id 和 Class选择器

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

  8. css选择器(1)——元素选择器、类名和id选择器

    css的主要优点之一就是它能很容易地向所有同类型的元素应用一组样式.当然它是通过选择器来实现这一点的. 基本规则结构: 语法= 选择器 +声明块 1.元素选择器——直接使用html元素名,指向文档元素 ...

  9. 请写出css中选择器（元素选择器、类选择器、id选择器）的优先级顺序，和当各种选择器组合时，优先级的计算规则是什么？

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

随机推荐

  1. Mongodb3.6 快速入门（一）

    一.安装 官网下载地址 文章中用的3.6community server 64 位. 安装完成后的目录如下: 二.启动Mongodb 有多种方式可以启动Mongodb,但在实际项目中,主要还是通过配置 ...

  2. Linux 命令——tee 重定向到文件并打印到屏幕

    需求: 源于我一个业务实现,需要通过shell脚本去调Java程序,并且能够拿到Java里面的返回值. 思路: 众所周知,通过shell调用Java,肯定是通过 Java -jar xxx.jar 命 ...

  3. Android之Drawable

    Android 中图片和常见的颜色都可以是一个Drawable. Drawable可以方便我们做出一些特殊的UI效果,这一点在UI相关的开发工作中尤其重要.其主要优点有: 使用简单,比自定义View成 ...

  4. [ASP.NET MVC4高级编程] 学习记录(一)

    理论: 先有GUI在发展,当用户按下某个键,某个进程会监听到这个动作,这个进程就是控制器.这就是MVC模式. 后来有了事件驱动编程,响应动作的是按钮本身,而不是控制器. 再后来webForm中,事件驱 ...

  5. Day4_迭代器

    迭代器: 是一个重复的过程,每一次重复都是基于上一次的结果而来. 可迭代对象: 凡是对象有_iter_方法(对象._iter_),该对象就是可迭代对象. 字符串,列表,元组,字典等都是可迭代对象. 可 ...

  6. Java中常用的数据结构类

    结构体系图 List ArrayList.LinkedList.Vector有什么区别? ArrayList 只能装入引用对象(基本类型要转换为封装类): 线程不安全: 底层由数组实现(顺序表),因为 ...

  7. 晒stlink以及stm8“开发板”

    先上图:(￣▽￣)" 单层板+几根飞线,之前做jlink-ob做过孔整怕了,画pcb的时候尽量朝单层画的 外壳用sw建模,并3d打印 引出了swim for stm8单总线调试接口 以及sw ...

  8. ThinkPHP简单的验证码实现

    ThinkPHP简单的验证码实现 写一个最简单的TP验证码. 写Controller 首先在Controller/IndexController.class.php(简称Index)文件中编辑: &l ...

  9. win10汇编环境的搭建

    第一步:下载DOSBox0.74-win32-installer 可以去官网:http://www.dosbox.com/ 或者链接:https://pan.baidu.com/s/1UA77qTLO ...

  10. 爬虫之ssh证书警告错误

    错误信息: 错误信息如下: requests.exceptions.SSLError: ("bad handshake: Error([('SSL routines', 'tls_proce ...