※ ChatGPTを利用し、要約された質問です（原文：スタイルシートの優先順位について）
このQ&Aのポイント
スタイルシートの優先順位に関して質問があります。HTMLとCSSを使用した場合、特定の要素に対して複数のスタイルが適用され、結果として予期しないフォントサイズが表示されることがあります。なぜこのような現象が起こるのか、教えていただきたいです。
FontChangeクラスとBodyタグのスタイルを使用した場合、要素に予期しないフォントサイズが適用されることがあります。このような状況が起こる原因について教えていただけますか？
HTMLとCSSを使用してスタイルを適用する際、特定の要素に対して複数のスタイルが適用され、表示が崩れることがあります。このような問題が起こる原因について、詳しい説明をお願いします。
以下のようなHTMLとCSSを記述したとします。
<p>タグに囲まれた「test」という文字に対して、Bodyタグから
font-size:10emと、PタグからFontChangeクラスを指定して、
font-size:0.1emを適用しています。
一見、優先順位の高いFontChangeクラスの0.1emが「test」に対して適用されそうに見えますが、
実際には両方のスタイルが適用され、中途半端なフォントサイズになります。
優先順位を無視してスタイルが2重適用されるのは何故でしょうか？
ご教授下さい。
宜しくお願いします。
<html>
<head>
<style type="text/css">
<!--
body {
font-size:10em;
}
.FontChange{
font-size:0.1em;
}
-->
</style>
</head>
<body>
<p class="FontChange" >test</p>
</body>
</html>
