html - 关于选择部分属性 CSS3 HTML5

Question

为什么当我有 3 个单独的段落时，每个段落都有一个匹配词作为其类属性的一部分，即使我没有按部分属性选择，它们的样式是否都相同...例如我有 4 个段落，3使用类 1)pad、2)pad bdr、3)pad bdr mgn，但下面的代码不包含 ~ 或 |对于按部分属性进行选择，尽管没有包含正确的类名，但下面的每一行代码都设置了所有 3 个段落的样式？

p.pad {padding: 1em}
p.bdr {border: 0.5em solid red}
p.mgn {margin: 2em}

Answer 1

选择器文档说明了留下的评论:.classes 方法:http://www.w3.org/TR/CSS2/selector.html#pattern-matching

我测试了一组 P 标签上提供的 CSS，没有得到奇怪的结果:http://jsfiddle.net/Roralee/Taejc/1/

.pad {padding: 1em}
.bdr {border: 0.5em solid red}
.mgn {margin: 2em}


<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam volutpat euismod aliquet. Phasellus porttitor gravida viverra. Sed at mauris faucibus, lobortis leo et, rhoncus velit. Duis varius turpis sed sollicitudin eleifend. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec mollis sapien a luctus convallis. Integer tincidunt posuere neque, congue congue lacus accumsan sed. Maecenas tempus massa eget vestibulum lacinia.</p>
<p class="pad">Aliquam erat volutpat. Nullam accumsan ipsum ut dui vulputate, eget congue elit mattis. Sed quis elit odio. Quisque blandit accumsan iaculis. Fusce et est id quam ultrices hendrerit. Etiam placerat posuere sem. Phasellus blandit, orci eget adipiscing commodo, erat quam vulputate metus, tristique auctor lectus nunc id nunc.</p>
<p class="pad bdr">Sed id semper nunc. Sed hendrerit augue magna, at aliquam nunc mollis id. Vivamus vitae neque id mi luctus ultricies. Donec id turpis lacus. Curabitur eu tincidunt est. Sed auctor suscipit accumsan. Donec lorem felis, porta at odio malesuada, rutrum congue erat. Morbi dui odio, aliquet eget vehicula at, porta blandit nulla.</p>
<p class="pad bdr mgn">Fusce facilisis urna sit amet malesuada adipiscing. Quisque pulvinar erat nec velit pulvinar varius. Nullam porta turpis ut tellus dignissim, sed pretium enim sollicitudin. Donec tincidunt, erat in volutpat vehicula, arcu nulla pellentesque felis, vitae ultrices mi erat et augue. Sed condimentum tempus tellus, at porta lorem pellentesque gravida. Nullam consectetur augue odio, blandit pellentesque elit varius eget.</p>  

如果已经提供的内容有相关的 HTML，那将会很有帮助。