。1 <！DOCTYPEのHTML > 2 < HTML > 3 < ヘッド> 4 < メタ文字セット= "UTF-8" > 5 < タイトル> </ タイトル> 6 < スタイルタイプ= "テキスト/ CSS" > 7 / * CSSコード* / 8 #box { 9 / * ここでのコードは、ブラウザがHTMLタグのように見えるように変更する必要があります教えてくれと言っている* / 10 / * 色が設定されている色を表す* / 11 色：ブルー; 12 } 13 / * 类选择器* / 14 .box2 { 15 色：緑。 16 } 17 / * ＃のP1 { 18 色：赤。 19 } 20枚の ＃P2 { 21 色：赤。 22 } * / 23 P { 24 色：赤。 25 } 26 </ スタイル> 27 <！ - このアプローチの利点：HTMLコードとCSSのコードが分離を維持するのは簡単ですしてみましょう- > 28 <！ - タイプの<リンクのrel = "スタイルシート" = "テキスト/ cssの"のhref = "スタイル/ index.css" /> - > 29 30 </ ヘッド> 31が < 身体> 32 <！ - 関連付けるカスタム名- > 33である <！ - <divのスタイル= "色：緑;">これは箱であります</ div> - > 34である < DIV ID = "ボックス" >これはボックス</ DIV > 35 < DIV クラス= "BOX2" > 36 これはBOX2である [37 </ DIV> 38 <！ - デマンド：フォント内部Pタグが赤色に配置されている- > 39 < P >これはP1である</ P > 40 < P >これはP2である</ P > 41である < P >これはP3であります</ P > 42である < P >これはP4である</ P > 43である </ ボディ> 44である </ HTML >
