override class declarations by styling id attributes - zilongxuan001/LearnFreecode GitHub Wiki

理解

id> class下边 > class上边 > body

id样式可以覆盖class样式,无论id在class上面还是下面

<style>
  body {
    background-color: black;
    font-family: Monospace;
    color: green;
  }
  .pink-text {
    color: pink;
  }
  
  #orange-text{
    color:orange;
  } 
  
  .blue-text {
    color: blue;
  }
</style>
<h1 class="pink-text blue-text" id="orange-text">Hello World!</h1>

在CSS中,classblue-text虽然在idorange-text下面,但是id的优先级高于class,所以h1的颜色为桔色。

在浏览器中显示如下 image

来源

Basic CSS: Override Class Declarations by Styling ID Attributes | Learn freeCodeCamp

CHANGELOG

2018-10-7 16:41:12

⚠️ **GitHub.com Fallback** ⚠️