HTML | body内にstyleタグでCSSを書くのは非推奨？
HTMLで<body>タグ内に<style>タグでCSSを書くのは非推奨なのかどうかについて紹介しています。
body内にstyleタグでCSSを書くのは非推奨です
HTMLの<body>タグ内に<style>タグを使ってCSSを記述する事は、W3C（World Wide Web Consortium）またはWHATWG（Web Hypertext Application Technology Working Group）の基準に沿っていないため、推奨されていません。
HTML5で一時的に許可されていたようですが、現在のHTML LSでは再び非推奨となっています。
一部のOSやブラウザで表示上の不具合が生じたり、SEO（検索エンジン最適化）にてマイナス要素となる可能性があります。それらのリスクを避けるためにも、<body>タグ内に<style>タグを挿入することは避けるべきです。
非推奨ではありますが、主要なブラウザが<body>タグ内の<style>タグを無視する訳ではありません。
レンタルなんとかなどのガラケー時代にあった古いWEBサービスでは<head>タグ内がカスタマイズできず<body>タグ内に<style>タグを設置されている事も少なくありませんでした。
例えば、以下のような<style>タグを含むHTMLコードを<body>タグ内に設置するとします。
<p class="sample">このテキストが黄色になればstyleタグ内のCSSが反映されている</p>
<style>
.sample {
color:#FFF000;
}
</style>
<p class="sample">このテキストが黄色になればstyleタグ内のCSSが反映されている</p>以下は、上記HTMLコードを実際に表示しています。
1.このテキストが黄色になればstyleタグ内のCSSが反映されている
2.このテキストが黄色になればstyleタグ内のCSSが反映されている
このように、<style>タグは普通に読み込まれていますし、<style>タグより上にある要素に対してもCSSが反映されている事が確認できます。
JavaScriptで後から上書きする処理と、どう違うのか疑問に思うところはありますが、非推奨な事には違いありません。
<head>タグ内に記述できず、CSSファイルも編集できない場合など、<body>タグ内でCSSのスタイルを適用するには、各要素に「style」属性を指定するか、JavaScriptを記述してCSSを上書きする事で解決可能です。