フォント CSS プロパティが太字のフォントの太さをキャンセルするのはなぜですか?

Question

コンピュータで生成された HTML に無駄なタグが多数含まれているため、不要なタグを削除するように依頼されました (色/強さ/色などの情報を保持したいだけです)。次のような HTML を見つけました:

<b>
  <span style="FONT: 20pt &quot;Arial&quot;">
    <strong>太字</strong> 太字ではありません <b>太字</b> 太字ではありません
  </span>
</b>

私の場合（Chrome と Firefox では）、太字 テキストは太字で表示され、太字ではない テキストは非太字で表示されます。これについて混乱しています。特に、これによりタスクがより複雑になりました。color/strong/em 情報なしでタグを削除できると考えたので、次のように変更しました。

<b>
   <strong>太字</strong>太字ではありません <strong>太字</strong>太字ではありません
</b>

しかし今では、以前とは異なり、すべてのテキストが太字になっています。

この動作を再現するために、FONT スタイルに何を入れることができるかを考えています。

Arial を foo に置き換えると、この動作が維持されます。

<b>
  <span style="FONT: 20pt foo">
    <strong>太字</strong> 太字ではありません <b>太字</b> 太字ではありません <!-- 太字ではないということは、実際には太字ではありません! 20 ポイントが適用されます -->
  </span>
</b>

サイズとフォントを切り替えると、動作が変わりました:

<b>
  <span style="FONT: &quot;Arial&quot; 20pt">
    <strong>太字</strong> 太字ではありません <b>太字</b> 太字ではありません <!-- すべてが太字です。20 ポイントは_適用されません -->
  </span>
</b>

2 つの値はどちらも影響しません:

<b>
  <span style="FONT: &quot;Arial&quot;">
    <strong>太字</strong> 太字ではありません <b>太字</b> 太字ではありません <!-- すべてが太字です -->
  </span>
</b>

<b>
  <span style="FONT: 20pt">
    <strong>太字</strong> 太字ではありません <b>太字</b> 太字ではありません <!-- すべてが太字です -->
  </span>
</b>

誰かがこの動作を説明できますか、または少なくとも外側のスタイルを抑制するにはどのスタイルを探す必要があるかを教えてください。

Answer 1

私の質問に対する答えは、font css プロパティのドキュメント ページ にあると思います。それは言う:

(私の強調)

もう少し下:

したがって、font: 20pt arial を設定することは、font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size: を設定することと同じです。 20pt ;行の高さ:標準;フォントファミリー:arial

特に、font-weight は bold (または他の値) から normal にリセットされます。

したがって、根本的な問題を解決するには、フォントの太さを指定していない font タグを探す必要があります。

追記 font: arial 20ptそのような動作がない理由は、これが font に許可されている値ではないため、無視されるためです:

そして、font: arial 20pt では、フォント ファミリは最後に指定された値ではありません。