私はこの順序で書かれた次のCSSを持っています：
h2:last-child, p:last-child, ul:last-child {
margin-bottom: 0;
}
.content-message {
margin: 20px -1.667em -1.667em -1.667em;
margin-bottom: -1.667em;
}
と私のHTML：
<ul class="content-message">
<li>xx</li>
</ul>
確認すると、ulが最初のCSSからスタイルを取得していて、マージンが0であることがわかります。これがなぜであるかを誰かが説明できますか。これを修正する方法もあります。
特異性の高い順に行われます。この場合、ul：last-childには次の2つの条件があるため、より具体的です。
2番目のスタイルには1つの条件しかありません。
2番目のスタイルを最初のスタイルと同じように具体的にするには、別の条件を追加する必要があります。
ul.content-message {
margin: 20px -1.667em -1.667em -1.667em;
margin-bottom: -1.667em;
}
2つのルールは同じように具体的であるため、最後に記述されているため、2番目のルールが優先されます。これはcssの特異性を単純化したものであることに注意してください。順序付けは次のように機能します。
リストの上位からのセレクターが優先されますが、同じレベルの2つのセレクターは、そのタイプがいくつあるかによって決まります（したがって、2つのクラスはIDよりも具体的ではありませんが、スタイルとタグと同じくらい具体的です） 。2つのスタイルは、同じ重みが最後に定義されたスタイルに延期されます。
ポイント5のすべての項目で同じ重みが間違っている可能性がありますが、理解を深めるには、http：//www.adobe.com/devnet/dreamweaver/articles/css_specificity.htmlまたはGoogleで見つかった同様の記事を確認してください。
cssの特異性の問題について説明しているこの記事を参照してください-http ：//www.stuffandnonsense.co.uk/archives/css_specificity_wars.html
優先順位- 要素セレクター<クラスセレクター<IDセレクター
したがって、Id属性として指定すると機能するはずです
#content-message {
margin: 20px -1.667em -1.667em -1.667em;
margin-bottom: -1.667em;
と<ul id="content-message">
更新-上記の場合に関係なく、インラインスタイル-style="margin-bottom: -1.667em;"は他のcssをオーバーライドします。それがあなたには起こらないのを見て驚いた。
どのスタイルに何を適用するかを「！important」マークを付けてください。