首页 > 其他分享 >[CSS 3] CSS Specificity

[CSS 3] CSS Specificity

时间:2023-06-20 14:45:36浏览次数:33  
标签:text h1 pseudo larget Specificity class CSS

 

So higher rank css will override lower rank css rules.

Inline styles will override any other css rules.

 

h1:not(.small-text) // 0011 - :not is not counted as pseudo class element
div h1:first-child // 0012 - 2 tags, 1 pseudo-class
div h1.larget-text::before // 0013 - 2 tag + 1 pseudo-element ::before, 1 class
.larget-text:nth-child(1) // 0020 - .larget-text is class, :nth-child is pseudo-class
h1.larget-text[id="title"] // 0021 - 1 attribute + 1 class, 1 tag
h1.larget-text#title // 0111 - 1 id, 1 class, 1 tag

 

 

标签:text,h1,pseudo,larget,Specificity,class,CSS
From: https://www.cnblogs.com/Answer1215/p/17493588.html

相关文章

  • HTML&CSS&JavaScript思维导图
    ......
  • vue配置scss全局样式
    安装插件npminstallsass--save-dev在src文件夹下创建styles文件夹,并创建以下文件index.scss:scss的入口文件//引入清除默认样式@import'./reset.scss';reset.scss:清除样式文件/***ENGINE*v0.2|20150615*License:none(publicdomain)*/......
  • 图书馆管理系统代码源码(php+css+js+mysql) 完整的代码源码,系统使用B/S架构。
    图书馆管理系统代码源码(php+css+js+mysql)完整的代码源码,系统使用B/S架构。优化过的界面,拥有管理员和普通用户,普通用户可注册登录,管理员可登录,功能齐全。管理员可管理普通用户,增加其他管理员,增添图书,借还书操作,查看已还书。普通用户,可在线查看现有图书,和自己已借图书。推荐使用php......
  • 选题系统代码源码(php+css+js+mysql) 完整的代码源码,系统使用B/S架构。
    选题系统代码源码(php+css+js+mysql)完整的代码源码,系统使用B/S架构。优化过的界面,拥有管理员、审核员、教师和学生这四种身份登录方式和对应功能,功能齐全。推荐使用phpstudy+navicat搭建和管理项目!服务:提供现成代码,提供环境搭建相关文档。选题系统代码源码是一套完整的代码源码,采......
  • vue 学习第17天 CSS学习 ---- 浏览器私有前缀 + css3阶段总结
    浏览器私有前缀是为了兼容老版本的写法,比较新的浏览器无需添加1、私有前缀 2、提倡的写法(私有前缀+属性) 总结:CSS3学习的  五个大方面         ......
  • vue学习第18天 css --- 移动web开发 (单独/响应式、常见布局【单独:流式、flex、rem
    学习目标: 目录: 移动端基础 1、浏览器现状  2、手机屏幕现状 3、常见移动端屏幕尺寸查看地址: https://www.strerr.com/screen.html注:作为前端开发,不用纠结dp,dpi,pt,ppi等单位。 4、移动端调试方法 5、......
  • vue学习过程中 遇到的问题 CSS塌陷 ----- 高度塌陷和外边距塌陷
    1、高度塌陷原因:父元素没有设置高度,子元素设置浮动属性(float:left)之后,父元素的高度为0.***<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge">......
  • vue学习第16天 CSS---3D转换 (translate3d 3d移动、3D旋转 rotate3d、transform-
    3D转换转换:1)3d移动 translate3d 2)3d旋转 rotate3d 3D的特点:1)近大远小2)物体后面遮挡不可见 3D转换:我们工作最常用的 3D位移 和 3D旋转 主要知识点: 1、三维坐标系(z轴,z外(屏幕)+,z内(屏幕)-)三维......
  • vue学习第15天 CSS ---- 动画animation
    动画动画(animation)是CSS3中具有颠覆性特征之一,可通过设置多个节点来精确控制一个或一组动画。常用来实现复杂的动画效果。相比较过渡,动画可以实现更多变化,更多控制,连续自动播放等效果。动画的优点(与过渡相比更好) 1、动画的基本使用(先定......
  • CSS3有哪些新特性
    CSS3引入了很多新特性,比如:1.选择器:CSS3引入了新的选择器,如伪类选择器、伪元素选择器等,使得选择元素更加灵活和精确。2.边框圆角:CSS3允许通过border-radius属性为元素的边框添加圆角,创建圆形、椭圆形或具有不同角度的矩形边框。3.盒阴影:使用box-shadow属性,可以为元素添加......