提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

css案例学习之class执行的顺序

案例学习执行CSS 顺序 Class
2023-09-27 14:24:31 时间 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>选择器.class</title>
<style type="text/css">
p{                        /* 标记选择器 */
    color:blue;
}
p.special{                /* 标记.类别选择器 */
    color:red;            /* 红色 */
}
.special{                /* 类别选择器 */
    color:green;
}
</style>
</head>
<body>
    <p>普通段落文本</p>
    <h3>普通标题文本</h3>
    <p class="special">指定了.special类别的段落文本</p>
    <h3 class="special">指定了.special类别的标题文本</h3>
</body>
</html>

先执行统一的.special

再执行特定p下面的.special

最终p元素下的颜色还是变成了红色

那些普通的special类元素没有变，依然是绿色

相关文章