2

私はcssを理解しようとしています、そして私が最初に試したのはこれでした：

<div style="
    height: 100px;
    width: 100px;
    border: 1px solid black"/>

<div style="
    height: 100px;
    width: 100px;
    border: 1px solid red"/>

と

<div style="
    height: 100px;
    width: 100px;
    border: 1px solid black"></div>

<div style="
    height: 100px;
    width: 100px;
    border: 1px solid red"/>

誰かが何が起こっているのか説明できますか？私は違いはないはずだと思っていました..今まで私は純粋なxmlだけを経験していたので、これは私にとってちょっとイライラします..

そしてもう1つの副次的な質問..全体を表示することでどのように機能しますか？まず最初に、ブラウザがDOMツリーを構築します。これは通常、要素の順序に応じて表示されます。スタイルによって定義される変更がほとんどないcssでも同じですか？つまり、スタイルシートのルールは、具体的な要素が表示されているときに最初に適用され、他のトリックは適用されません。

4

6 に答える 6

5

あなたは間違いなく、text/htmlコンテンツタイプでXHTMLを提供しています。

これは、HTMLからXHTMLへの移行を容易にするために設計されたハックであるため、ブラウザーがサポートする前にXHTMLの使用を開始できます。10年経っても、Internet Explorerはまだサポートしておらず、HTMLに戻りました。

このハックを使用しているため、XMLパーサーおよびXMLパーサーと互換性があるようにXHTMLを作成する必要があります。これは、以下を含むHTML互換性ガイドラインに従うことを意味します。

要素がコンテンツを許可しているが（たとえば、div要素）、その要素のインスタンスにコンテンツがない場合（たとえば、空のセクション）、「最小化された」タグ構文（たとえば、<div />）を使用しないでください。

コンテンツを許可しない要素は「EMPTY」として定義され、要素のHTMLリストで簡単に見つけることができます。

于 2010-01-31T11:47:18.047 に答える
1

CSS は任意の「タグ」に適用できますが、使用は<div>正しくありません。divタグには常に終了タグが必要です。

<div><!-- HTML here --></div>

そして、何が起こっているかというとdiv、幅と高さを 100 ピクセルにし、幅が 1 ピクセルの黒い境界線を指定することです。

いくつかのCSS チュートリアルを読みたいと思うかもしれません。

あなたも試すことができます

<img src="path/to/some/image" style="border:5px solid black;" />

自己終了タグで動作することを確認する;)

XHTML で有効な自己終了タグのリスト。

于 2010-01-31T11:30:37.517 に答える
1

<div>s にはコンテンツがあるはずなので、自己終了タグではありません。CSS プロパティは問題ありませんが、マークアップが正しくありません。

于 2010-01-31T11:33:33.370 に答える
1

本当に自己終了 DIV が必要な場合:

  1. コンテンツを XHTML として提供します。これには正しい MIME タイプ ( ) の使用が含まれますが、まだ XHTML を理解しないブラウザーapplication/xhtml+xmlを処理する必要があることに注意してください。

  2. 有効な XHTML doctype と名前空間を使用してください。

例えば

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

これにより、期待どおりに DIV が表示されますが、私の経験では、古き良き HTML 4 strict を提供する方がはるかに手間がかかりません。

于 2010-01-31T12:11:01.200 に答える
1

前述のように、div要素には開始タグと終了タグが必要です...いくつかの例で行ったことを行わない限り:

<div />

または…</p> 

<div/>

これは自己閉鎖 (空)divです。

したがって、CSS テストでは、おそらく使用したくないでしょう<div />—<div>Foo</div>代わりに使用してください。

于 2010-01-31T11:35:37.977 に答える
-2

あなたの DIV の問題が CSS に基づいているかどうかはわかりませんが、ブラウザの解釈の問題だと思います。ブラウザーは、DIV にコンテンツがあることを期待しており、それらを正しくレンダリングしない可能性があります。XHTML は XML と互換性がありますが、それ自体は XML ではありません (つまり、すべての規則に準拠しているわけではありません)。

CSSは、自己終了タグ (IMG や HR など) に対して機能します。

2 番目の質問は正しいようです。ブラウザーは効果的にスタイルシートをキャッシュし、DOM 内で関連するタグを見つけるたびにスタイルを適用します。通常、ページへの描画が行われる前に行われるため、これらすべてが実際に行われることはありません。CSS 参照を使用して DOM タグを動的に追加すると、スタイルシートで定義されたスタイルが自動的に適用されます。

于 2010-01-31T11:32:15.323 に答える