返回顶部
首页 > 资讯 > 前端开发 > VUE >css中优先级的衡量标准有哪些
  • 187
分享到

css中优先级的衡量标准有哪些

2024-04-02 19:04:59 187人浏览 薄情痞子
摘要

本篇内容主要讲解“CSS中优先级的衡量标准有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“css中优先级的衡量标准有哪些”吧!   一、背景   CSS

本篇内容主要讲解“CSS中优先级的衡量标准有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“css中优先级的衡量标准有哪些”吧!

  一、背景

  CSS有三大特性:层叠性、继承性、优先级。

  而我们在给CSS定义样式的时候,经常出现两个及以上的规则应用在同一元素上,单该元素最终在浏览器呈现的效果是应用的哪个规则呢?这就要考虑优先级的问题了。

  CSS优先级是由CSS权重来作为衡量标准的,权重的计算有一套计算公式,有如下规范:

  使用一个4位数的字串来表示级别,从左到右,左边的做大,往右依次递减,且数位之间没有进制,级别之间不可逾越。没有进制的意思是:即使是10个标签的权重相加也不会大于类选择器的权重,类推,十个类选择器的权重也小于id选择器的。

  继承或者*的贡献值 0,0,0,0

  每个元素(标签)的贡献值 0,0,0,1

  每个类、伪类贡献值 0,0,1,0

  每个ID贡献值 0,1,0,0,

  每个行内式贡献值 1,0,0,0

  每个!important 无穷大

  二、权重的计算实例

  以一下代码为例:

  <div>

  <ul>

  <li>1</li>

  <liclass="red">2</li>

  <liclass="red"id="blue">3</li>

  <liclass="red"id="blue">4</li>

  <li>5</li>

  <li>6</li>

  </ul>

  </div>

  首先给li以下样式:

  divulli{

  width:200px;

  height:30px;

  border:1pxsolid#000;

  background-color:pink;

  }

  标签选择器的权重

  选择器pulli是后代选择器,三个标签的权重都是(0,0,0,1),因为是同一级选择器,权重可以相加,最后得到pulli的权重就是(0,0,0,3)。

到此,相信大家对“css中优先级的衡量标准有哪些”有了更深的了解,不妨来实际操作一番吧!这里是编程网网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

--结束END--

本文标题: css中优先级的衡量标准有哪些

本文链接: https://lsjlt.com/news/93109.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • css中优先级的衡量标准有哪些
    本篇内容主要讲解“css中优先级的衡量标准有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“css中优先级的衡量标准有哪些”吧!   一、背景   CSS...
    99+
    2024-04-02
  • python中有哪些线程优先级队列
    今天就跟大家聊聊有关python中有哪些线程优先级队列,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。Python主要用来做什么Python主要应用于:1、Web开发;2、数据科学研究...
    99+
    2023-06-14
  • Golang 技术性能优化的衡量指标有哪些?
    衡量 go 技术性能优化的关键指标包括:响应时间:衡量应用程序对请求的响应速度。吞吐量:衡量应用程序处理请求的速率。内存使用:衡量应用程序使用的内存量。cpu 使用率:衡量应用程序使用的...
    99+
    2024-05-11
    golang 技术性能
  • 服务器性能优化有哪些衡量指标
    这篇“服务器性能优化有哪些衡量指标”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“服务器性能优化有哪些衡量指标”文章吧。面试场...
    99+
    2023-06-19
  • CSS选择器有哪些?CSS选择器优先级怎么排序?
    这篇文章将为大家详细讲解有关CSS选择器有哪些?CSS选择器优先级怎么排序?,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。CSS选择器 CSS选择器用于从HTML文档中选择特定的元素或元素集,以便对其应用...
    99+
    2024-04-02
  • SQL92标准隔离级别有哪些
    本篇内容主要讲解“SQL92标准隔离级别有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“SQL92标准隔离级别有哪些”吧!    &nb...
    99+
    2024-04-02
  • CSS中优先级的示例分析
    这期内容当中小编将会给大家带来有关CSS中优先级的示例分析,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。计算优先级优先级是根据由每种选择器类型构成的级联字串计算而成的。他...
    99+
    2024-04-02
  • html标签属性和css属性的优先级哪个比较高
    这篇文章给大家分享的是有关html标签属性和css属性的优先级哪个比较高的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。html标签属性和css属性相比,css属性的优先级高。原因:W3C标准提倡使用CSS样式,提...
    99+
    2023-06-15
  • CSS中的选择器优先级顺序
    本篇内容主要讲解“CSS中的选择器优先级顺序”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS中的选择器优先级顺序”吧!特殊性是什么在对一个HTML元素应用C...
    99+
    2024-04-02
  • 怎么衡量优质香港服务器租用的标准
    衡量优质香港服务器租用的标准可以从以下几个方面进行考量: 稳定性:优质的服务器应具有良好的稳定性,能够保证长时间的稳定运行,避免...
    99+
    2024-04-02
  • 衡量优质香港服务器租用的标准是什么
    衡量优质香港服务器租用的标准是:1、看香港服务器所属的IDC机房设备质量是否较好;2、看香港服务器的带宽是独享带宽还是共享带宽;3、看香港服务器的售后技术支持服务是否较好。具体内容如下:机房:因为IDC机房的级别不同,所采用的网络设备也不一...
    99+
    2024-04-02
  • HTML的最新标准有哪些
    今天就跟大家聊聊有关HTML的最新标准有哪些,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。什么是HTML5 简单地说,...
    99+
    2024-04-02
  • Linux的进程优先级NI和PR有哪些区别呢
    这篇文章将为大家详细讲解有关Linux的进程优先级NI和PR有哪些区别呢,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。为什么要有进程优先级这似乎不用过多的解释,毕竟自从多任务操作系统诞生以来...
    99+
    2023-06-16
  • 如何衡量和优化并发程序的性能?有哪些性能指标?
    如何衡量和优化并发程序的性能 性能指标 衡量并发程序性能时,应考虑以下关键指标: 吞吐量: 每秒处理的请求数。 延迟: 处理单个请求所需的时间。 响应时间: 从收到请求到返回响...
    99+
    2024-05-08
    性能指标 并发程序
  • 香港企业级服务器租用的标准有哪些
    香港企业级服务器租用的标准通常包括以下几个方面: 服务器性能:包括服务器的处理器、内存、存储容量等硬件配置,以确保服务器能够满足...
    99+
    2024-04-29
    服务器
  • css样式表的三种样式哪个优先级高
    css 样式优先级依序为:内联样式(最高)、内置样式(次之)、外部样式表(最低)。优先级最高者胜出,相同优先级则按内联、内置、外部顺序应用。 CSS 样式表中优先级高的三种样式 在 C...
    99+
    2024-04-06
    css
  • css样式表里优先级别最高的是哪个
    css样式表中优先级最高的样式是内联样式,它直接嵌入到html元素中,作用于特定的元素。其语法为 文本,并高于嵌入式样式和外部样式。 CSS样式表中优先级最高的样式 CSS样式表中优...
    99+
    2024-04-25
    css html元素
  • 如何理解CSS编写中的属性优先级
    今天就跟大家聊聊有关如何理解CSS编写中的属性优先级,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。当你将一个样式添加到元素上却发现不起作用时,那就是...
    99+
    2024-04-02
  • 怎么用important改变CSS中优先级的顺序
    这篇“怎么用important改变CSS中优先级的顺序”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来...
    99+
    2024-04-02
  • Java的标准数据流有哪些
    这篇文章主要讲解了“Java的标准数据流有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Java的标准数据流有哪些”吧!Java输入输出(I/O)API是Java里最重要的API之一。J...
    99+
    2023-06-17
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作