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

一般在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. plsql developer 使用 oracle instantclient的安装和配置

    本文由ibyedo1贡献 1.下载 oracle instantclient basic package,在 oracle 官网下载就可以,地址如下: http://www.oracle.com/te ...

  2. Memcache架构新思考

    2011年初Marc Kwiatkowski通过Memecache@Facebook介绍了Facebook的Memcache架构,现在重新审视这个架构,仍有很多方面在业界保持先进性.作为weibo内部 ...

  3. [C#网络应用编程]1、对进程的操作

    在.net中,Process类提供了对进程进行管理的各种方法. 一.获取进程集合的方法: Process[] myProcesses = Process.GetProcesses();  //获取本地 ...

  4. 多重影分身——C#中多线程的使用三(调用方法和传参)

    对Thread: 1.使用ThreadStart static void Main(string[] args) { Thread th1=new Thread(new ThreadStart(Say ...

  5. There is No Alternative~最小生成树变形

    Description ICPC (Isles of Coral Park City) consist of several beautiful islands. The citizens reque ...

  6. Hystrix 熔断机制原理

    相关配置 circuitBreaker.enabled 是否开启熔断 circuitBreaker.requestVolumeThreshold 熔断最低触发请求数阈值 circuitBreaker. ...

  7. JS前端调用后台方法

    //JS前端代码function Exportqmdltb() { var areavalue= GetQmdltmValue(); $.ajax({ type: "post", ...

  8. Java多线程：wait(),notify(),notifyAll()

    1. wait(),notify(),notifyAll() 2. wait() 2.1. wait() 2.2. wait(long timeout) 2.3. wait(long timeout, ...

  9. cug-day02

    昨天就主要就熟悉了项目,今天就简单完成了 后台代码,但是没有进行测试,前端的vue也不是很懂,所以还有很多需要学习的地方. 目前主要就是需要理解项目运行流程, 项目采用的是ssh ,用了vo和po , ...

  10. 部署Dubbo监控中心

    1.部署监控中心: [root@localhost ~]# cp dubbo-admin-2.5.4.war apache-tomcat-7.0.47/webapps/dubbo-admin.war ...