CSS样式优先级和权重问题(部分)
2018-06-24 02:13:31来源:未知 阅读 ()
内联样式: <div style="font-size: 12px;">姓名</div>
外部样式: <link rel="stylesheet" href="css/bootstrap.min.css" />
内嵌样式 : <style>
.name{
font-size: 12px;;
}
</style>
jquery书写样式:$('#name').css('font-size','12px');
id选择器: <div id="name">姓名</div>
class选择器:<div class="name">姓名</div>
一般情况下,优先级问题:
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; 那这个样式的权重最高。
感谢yy_68的指正~
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
- DIV居中的经典方法 2020-06-13
- CSS中的float和margin的混合使用 2020-06-11
- Html/css 列表项 区分列表首尾 2020-06-11
- css与javascript重难点,学前端,基础不好一切白费! 2020-06-11
- ie8下透明度处理 2020-06-11
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash