我们都知道css属性优先级一般情况下是
- id>class>标签选择器。
内联样式>内部样式表>外部样式
但是还有一种特殊情况:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .wrap>.div1{ background-color: blue; } .div1 { background-color: yellow; } </style> </head> <body> <div class="wrap"> <div class="div1" style=" 300px;height: 300px;"></div> <div class="div1" style=" 300px;height: 300px;"></div> </div> </body> </html>
wrap中的两个div背景色都显示绿色
结论:.wrap>.div1优先级高于.div1