Web2.0_Experience交換におけるXHTML CSS設計の注意点まとめ

注:
1. DOCTYPE の選択以外のステートメントは、小文字の英字で記述する必要があります。これらには、Macromedia Dreamweaver によって生成される OnMouseOver などのマウス アクションが含まれますが、これも onmouseover に変更する必要があります。

2. XHTML 構文では、すべてのタグに開始と終了が必要です。たとえば、

と 、

と

などです。ペアになっていないタグの場合は、タグの末尾にスペースを追加し、その後に「/」を追加する必要があります。たとえば、
は
、 は と記述されますが、スペースを追加する理由は、コードを接続したときにブラウザーがコードを認識しないのを防ぐためです。

3. すべての XML タグは適切にネストする必要があります。たとえば、

は次のように変更する必要があります:

つまり、レイヤーごとのネストは厳密に対称である必要があります。

4. すべての属性は引用符 "" で囲む必要があります。たとえば、 は に変更する必要があります。特殊な場合には、属性値に二重引用符を使用する必要があります。たとえば、 のように、" を使用できます。一重引用符は ' を使用できます。

5. すべてを入力します。 ) はエンコードする必要があります。ラベルの部分は & g t ; としてエンコードする必要があり、エンティティの一部ではないアンパサンド (&) は & amp ; としてエンコードする必要があります (上記のコード文字の間にスペースはありません)

6すべての属性に値を割り当てます。例: は次のように変更する必要があります: 。

7. コメントの内容には「--」を使用しないでください。例: 内部の点線は等号またはスペースに置き換えることができます です。

1 つ目は、ファイル ヘッダーを記述する標準的な方法です。

コード:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\" target=\"_blank\">http://www.w3.org/TR/xhtml1 /DTD /xhtml1-transitional.dtd">
http://www.w3.org/1999/xhtml" lang="utf-8">








[クリップボードにコピー]



CSS の定義に関しては、ユニバーサル フォント設定スキームを推奨する価値があります。内容は次のとおりです。
コード: body { font -family : "Lucida Grande"、Verdana、Lucida、Arial、Helvetica、Song Dynamic、sans-serif; }
[クリップボードにコピー]


フォントは以下で選択されています記載されている順序。ユーザーのコンピュータに Lucida Grande フォントが含まれている場合、ドキュメントは Lucida Grande として指定されます。そうでない場合は Verdana フォントとして指定され、Verdana がない場合は Lucida フォントとして指定され、以下同様です。

Lucida Grande フォントは Mac OS X に適しています。

Verdana フォントはすべての Windows システムに適しています。

Lucida は UNIX ユーザーに適しています。

「Song Ti」は簡体字中国語ユーザーに適しています。

いずれのフォントでもない場合は、リストされているフォントが使用可能な場合は、デフォルトのサンセリフ フォントが呼び出されることが保証されています。


CSS ではリンク スタイルを定義するために 4 つの疑似クラスが使用されます。a:link、a:visited、a:hover、a:active です。例:

a :link{フォントの太さ : 太字 ;テキストの装飾 : なし ;カラー : #c00 ;}
a:訪問済み {フォントの太さ : 太字 ;テキストの装飾 : なし ;カラー : #c30 ;}
a :hover {フォントの太さ : 太字 ;テキスト装飾 : 下線 ;カラー : #f60 ;}
a:active {フォントの太さ : 太字 ;テキスト装飾 : なし ;カラー : #F90 ;}
ただし、書く順番には注意が必要で、正しい順番は「LVHA」です、このように書かないと期待と異なる効果が出る可能性があります。

中間部分のレイアウトの標準化とメニューの非テーブル実装については実践的な指導が必要なため、ここでは何も書きません。コード検証に関する記録をいくつか書いてみましょう。

XHTML 検証の一般的なエラーによる比較表:
DOCTYPE が見つかりません! HTML 4.01 へのフォールバック (移行) -- DOCTYPE が定義されていません。

文字エンコーディングが見つかりません! UTF-8 にフォールバックします -- 未定義の言語エンコーディング。

「img」の終了タグが省略されましたが、OMITTAG NO が指定されました。イメージ タグは「/」で閉じられていません。

SHORTTAG YES が指定されていない限り、属性値の指定は属性値リテラルである必要があります。属性値は引用符で囲む必要があります。

要素 "DIV" 未定義---DIV タグは大文字では使用できません。小文字の div に変更する必要があります。

必須属性「alt」が指定されていません---画像には alt 属性を追加する必要があります。

必須属性「type」が指定されていません---JS または CSS によって呼び出されたタグに type 属性がありません。

CSS2 検証の一般的なエラーの原因の比較表:
(警告) 無効な数値: color909090 はカラー値ではありません: 909090 ---16 進数のカラー値には「#」記号を追加する必要があります。 、#909090
(警告) 無効な数値: margin-top 不明な寸法: 6 ピクセル ---ピクセルは単位値ではありません。正しい書き方は 6 ピクセルです。
(警告) 属性scroll_bar-face-colorは、存在しません: #eeeeee --- スクロール バーを定義します。 カラーは非標準属性です。
(警告)Line: 0 font-family: 最後の選択肢としてタイプ ファミリを指定することをお勧めします。W3C では、次のことを推奨しています。フォントを定義するときは、Web フォントがさまざまなオペレーティング システムで表示できるようにするために、「sans-serif」などのフォントの種類で終わります。
(警告)行: 0 他のプロファイルの警告メッセージが見つかりません。 - コードに標準以外の属性または値があることを示します。プログラムが対応する警告情報を判断して提供できないことを確認してください