让两个子元素各占父元素的一半, 每个人能想到的都是 display: inline-block; width: 50%; , 但实际上却并不会平分, 而是会上下排列, 这是怎么回事呢?

对于初学者来说, 区别 nth-child 和 nth-of-type 是一个比较头疼的问题, 为了更好帮助大家区别两者使用方法, 特在此加以区分.