web-dev-qa-db-ja.com

<body>に<style>を含めるのは間違った考えでしょうか？

以下のコードでは、headではなく、bodyタグを使用して内部スタイルシートを配置しました。単一ページアプリケーションの場合、個別のpagespecific.cssファイルを使用するのではなく、そのページだけに適用できるスタイルに対してこれを行うことを検討しています。

これをヘッドセクションに配置していないため、これがマイナス面になるシナリオはありますか？

<!-- myPartial.html starts here --> 
<!-- Like to keep styles unique to this html right here in this file --> 
<div>
  <style>
    body { background-color: red; }
    #myText { color: white; }
  </style>

  <span id='myText'>Hello</span>
</div>
<!-- myPartial.html ends here -->
htmlcss
12
Saran

style要素内のbody要素は、HTML構文規則に違反しています。 （ただし、HTML5ドラフトによると、scoped属性が存在する場合、条件によっては許可されます。この属性は一部のブラウザーでサポートされています。）一方、ブラウザーは気にしません。 head要素とbody要素への分割は理論的なものです。

ただし、styleをhead内に配置するのとは逆に、無効な構文を使用しても何も得られません。唯一の言い訳は、一部のオーサリング環境では、headの部分に何も入れられない可能性がある技術的な制限です。

style要素とlinkを介した外部スタイルシートの使用の問題は、この質問と完全に直交しています。

18
Jukka K. Korpela

（私たちはここSE.SXにいるので、より戦略的なアプローチは、通常の技術的な考慮事項への価値ある補強になるかもしれません。）

[序文] HTML5仕様は絶え間なく変化するターゲットであり、確立された一般的な慣習をフォローアップする方針を持っています。彼らは過去に時代遅れで復活した機能を使用し、他の人の意味を変え、系統的な推奨事項の焦点をシフトしました。人類のすべての知恵を一度に利用できるように、永遠に書かれたものではありません。仕様は神聖な真実の源ではありません。時々ブラウザが正しいのは当然です。 [/前文]

OPの状況は圧倒的に一般的で有効です。

テーマが設計およびインストールされたCMSがあり、すべてのCSSがHEADから適切にロードされた後、ページエディターに「ソースモード」に切り替えられる（神に感謝します）おしゃれなWYSIWYGボックスが残っています。 HTMLマークアップに入力（貼り付け）（以前は別の場所で作成され、より適切なツールを使用）。幸いにも、STYLEタグを含めることもできます（おそらくタグフィルターでの偶発的な省略が原因です）...繰り返し行われる、魂を破壊する大量のうんざりする作業から、その日は救われました。しかし、ページ編集のシナリオからシステムのHEAD要素を妨害する手段はありません）。

仕様がそう言っているからといって、HTMLフラグメントで簡単な方法でCSSを使用する必要はありませんか？

または、単一ページのAJAXアプリケーションがあります。

長いセッションの間、リロードなしで実行されており、さまざまなランダムソースからのシンジケートコンテンツがあり、それらはすべて任意に独立してスタイル設定されています。 STYLE要素を埋め込むだけでなく、インラインSTYLE属性のみを使用するように最初に変換するように要求するのは、ばかげたことです。

さらに：a）BODY属性を使用して、CSSをSTYLEの任意の場所に既に埋め込むことができるため、CSSはとにかく「理論的に」合法です。 b）Javascriptから（またはその他の）必要なときにいつでも、ほぼすべてのスタイルで好きなことができるので、CSSは病理学的にパフォーマンスの低い方法で誤用する可能性もあります。そして、私たちの誰もがこれらの機能に反対することはありません。 W3Cも同様です。

それでは、STYLEのBODY要素について、何がそれほど悪いのでしょうか。 HTMLコンストラクトに対する虐待の広範な武器庫に追加される、それらの余分な悪影響は何ですか？より悪いパフォーマンス？多分。時々。

それが理由ですべてのブラウザによってサポートされているこの信じられないほど有用な慣行を廃止する正当な理由ですか？ 100万マイルではありません！

私たちは馬鹿ではありません。ええと、すべてではない、または常にそうとは限らない...;）パフォーマンスが低下するリスクのあるテクニックは、単に禁止されているのではなく、単にdocumentedの可能性があります。私たちは以前、JavaアプレットをWebの初期の頃に持っていて、生き残りました。車は誤用され、悲惨さを引き起こし、食べ物でさえ邪魔で非効率的な方法で使用される可能性があり、食べることができるドライバーは平均して、平均的なWebデザイナーよりもさらに愚かです。さらに、W3C様、心配する必要はありません。STYLEのBODY要素を使用して、HTMLティンカラーの怒りに満ちた群れは、彼らはW3Cを追いかけて復讐をすることはできません。彼らは住所を知りませんし、足もありません。

ですから、STYLEがBODYで合法になることについて声を上げてください。テキストを素直に引用しますが、現在の状況よりもbetterである実行可能な代替案を提供できなければ、役に立ちません。これは、実際には、この最後の手段の回避策手法に対する脅威です。

HTML5の仕様は推奨と呼ばれています。

6
lunakid

html仕様 は、

スコープ属性のないスタイル要素は、ドキュメントの先頭に表示されるように制限されています。

Scoped属性はブール値であり、スタイル要素の親要素をルートとするサブツリーにのみ適用されることを示します。

現時点では、Firefoxのみがscoped属性をサポートしています。 http://www.w3schools.com/tags/att_style_scoped.asp

2
crad

CSSをファイルで使用する場合とスタイルタグで使用する場合の技術的な理由はいくつかあります。

  • Css minifierを使用する機能（minifierがスタイルタグで機能するとは思わない）
  • ブラウザでcssファイルをキャッシュできるようにするため。

ファイルを使用するいくつかの意見に基づく理由：

  • Sass（Compass）やLessなどのすばらしいcssプリプロセッサを使用できます。
  • アプリケーションにCSSを追加する2つの方法を維持しています。

私の個人的な好みは、コンパスを使用してページごとに個別のファイルを保持し、それを使用してそれらをすべて1つのファイルにコンパイルすることです。その単一のファイルは、すべてのページに含まれます。将来、ファイルは常に何らかの理由で分離される必要がありますが、それまでの間、面倒なことはありません。

1
pllee