记一个让我“翻车”的css问题

昨天读了大漠老师的《CSS现状和如何学习》一文，遇到了一个让我“翻车”的问题。

例：

.red {
  color: red
}
.blue {
  color: blue
}

<div class="red blue">Text1<div>
<div class="blue red">Text2<div>

那么问题来了？Text1和Text2最终都会呈现出什么样式？

再比如：

.a {
  color: red;
}
.b {
  color: blue;
}
.a.b {
  color: orange;
}
.b.a {
  color: yellow;
}

<div class="a">Text</div>
<div class="b">Text</div>
<div class="a b">Text</div>
<div class="b a">Text</div>

这个栗子当中的四个div又将呈现什么效果呢？

欢迎评论区讨论~