必需掌握!css基础知识(优先级与权重)!

  • 时间:2019-01-14 22:09 作者:前端似锦 来源:前端似锦 阅读:847
  • 扫一扫,手机访问
摘要:内联样式: 姓名外部样式: 内嵌样式 : .name{font-size: 12px;;}jquery书写样式:$('#name').css('font-size','12px');id选择器: 姓名class选择器:姓名一般情况下,优先级

必需掌握!css基础知识(优先级与权重)!


内联样式

姓名

外部样式

内嵌样式

jquery书写样式:$('#name').css('font-size','12px');

id选择器

姓名

class选择器

姓名

一般情况下,优先级问题:

jquery书写样式 > 内联样式 > 外部样式;

id选择器 > class选择器 ; id一般作为数据传输,样式的话尽量使用class;

在html页面中,程序是自上至下执行的,执行晚的优先级高,假如外部样式先执行,内嵌样式后执行,则内嵌样式 > 外部样式

权重问题:

元素,伪元素: +1 p{font-size:12px;} 直接写p标签的样式

类,伪类,属性: +10 class选择器

ID: +100 id选择器

内联样式: +1000 内联样式

用代码(js,jquery)书写的样式: +较高 $('#name').css('font-size','12px');

!important : +最高 p{font-size: 20px !important;};

例如以下样式:

p {} p为元素 总权重就是:1

div p{} p与div都是元素 总权重是:1=1=2

.div p{} .div是类,p是元素 总权重是:10+1=11

.div .class_p{} .div是类 .class_p是p元素的class 总权重是:10+10=20

先写这么多!

!important : 这个较为特殊,只需写在样式后边 font-size: 20px !important; 那这个样式的权重最高。

必需掌握!css基础知识(优先级与权重)!

  • 全部评论(0)
最新发布的资讯信息
【系统环境|】2FA验证器 验证码如何登录(2024-04-01 20:18)
【系统环境|】怎么做才能建设好外贸网站?(2023-12-20 10:05)
【系统环境|数据库】 潮玩宇宙游戏道具收集方法(2023-12-12 16:13)
【系统环境|】遥遥领先!青否数字人直播系统5.0发布,支持真人接管实时驱动!(2023-10-12 17:31)
【系统环境|服务器应用】克隆自己的数字人形象需要几步?(2023-09-20 17:13)
【系统环境|】Tiktok登录教程(2023-02-13 14:17)
【系统环境|】ZORRO佐罗软件安装教程及一键新机使用方法详细简介(2023-02-10 21:56)
【系统环境|】阿里云 centos 云盘扩容命令(2023-01-10 16:35)
【系统环境|】补单系统搭建补单源码搭建(2022-05-18 11:35)
【系统环境|服务器应用】高端显卡再度登上热搜,竟然是因为“断崖式”的降价(2022-04-12 19:47)
手机二维码手机访问领取大礼包
返回顶部