我们证明了无论在 style 元素 CSS 的哪个位置进行声明,id 声明都会覆盖 class 声明。
还有其他覆盖 CSS 的方法。你还记得行内样式吗?
试着用 in-line style(行内样式) 使 h1 元素变为白色。记住,行内样式看起来是这样的:
<h1 style="color: green">
保留 h1 元素中的 blue-text 和 pink-text 两个 class。
<style>
body {
background-color: black;
font-family: Monospace;
color: green;
}
#orange-text {
color: orange;
}
.pink-text {
color: pink;
}
.blue-text {
color: blue;
}
</style>
<h1 id="orange-text" class="pink-text blue-text">Hello World!</h1>
<style>
body {
background-color: black;
font-family: Monospace;
color: green;
}
#orange-text {
color: orange;
}
.pink-text {
color: pink;
}
.blue-text {
color: blue;
}
</style>
<h1 style="color:white" class="pink-text blue-text">Hello World!</h1>