加入我把p span{colot:purple;}写在前面，机会出现问题，因为.first的权值为10。但是p span的权值为2，怎么理解出现的这个现象呢？
不是这个问题，是你的分号加错位置了。
第8行：p span{color:purple};
大括号外面是不需要分号了，加了就报错了，页面渲染混乱了。你把分号加到大括号里面吧，才能正常的渲染页面。