DIV+CSS(2)_html/css_WEB-ITnose を一緒に学びましょう

編集者: Zhutou Communication QQ: 117376883

第 1 章: どこから始めればよいですか?

最初はすべてが難しいですが、どこからチュートリアルを始めればよいですか?最初の章でいくつかの言葉を書く前に、私はまだ考えていましたが、その日私の弟子が私に尋ねた質問を思い出しました。ここからチュートリアルを始めましょう。

その日、私の弟子は私にこう尋ねました:

スタイル シートで表示スタイルを制御するにはどうすればよいですか?そのとき私は彼女に直接答えませんでしたが、「あなたは CSS ページ処理の原理についてあまり明確な概念を持っていません。まず CSS を深く勉強しないでください。まず原理を理解する必要があります。」と言いました。

…….

それでは、多くの人がこの概念についてよく理解していないため、私のチュートリアルの最初の章として CSS ページ処理の原理を取り上げましょう。

Web ページ作成のいわゆる div+css (実際には xhtml または xml+css) の原則は、コンテンツ div とスタイル css (式) を分離することです。この種の Web ページの外観を学ぶことは最も重要ではありません。適切に構造化された xhtml ページは、どのような外観でも表示できます。CSS Zen Garden はその典型的な例です。 CSS Zen Garden は、CSS の力を最終的に認識するのに役立ちます。

この Web ページ制作テクノロジーを学ぶには、コンテンツとスタイルの分離の概念を完全に理解する必要があります

1. まずコンテンツについて話しましょう

コンテンツとは、最終ページが閲覧者に表示する情報です。ニュース、写真、アニメーション、ビデオなど、これらのコンテンツが含まれるページを作成する前に、それらがどのように表示されるかを気にせず、適切な構造でページに記述してください。ページ内に含まれるもの 必要なコンテンツを表示するだけ！一言で言えば、必要なものはすべてすでにページ上にあります。もちろん、これは最小要件であり、上に青で示した単語構造を追加しました。優れたフロントエンド開発者は、xhtml ページを作成するときに CSS とデータベース (動的ページ) をより適切に統合する方法をすでに検討しています

もちろん、 div+css を初めて使用する方でも、心配しないでください。ゆっくり時間をかけてください。

2. スタイルについて話しましょう

これについて話す前に、まず Zen Garden の Web サイト http://www.csszengarden.com/

にアクセスしてください。なぜこの Web サイトを参照する必要があるのですか? CSS 最も強力なのは、Zen Garden Web サイトのすべてのページの xhtml コードが同じであることです。興味があれば、オンラインでダウンロードできます。では、なぜ表示スタイルが異なるのでしょうか。はい、スタイル シートが機能しています。ページごとに異なる外部スタイル シートが呼び出されます。この Web サイトは、前の文「適切に構造化された xhtml ページはどのような外観でも表現できる」を完全に説明しています。

CSS の威力を理解したところで、行動を起こす準備はできていますか?

心配しないでください、まだ最初の章は終わっていません

テーブルを使って Web ページを作成する方法を学んだ人にとって、この方法を学び続けるのは少し難しいかもしれません。私はテーブルを使って Web ページを作成する前にこの方法を学びましたが、テーブルを学習してから div+css を学習した後、この方法を独学で直接学びました。特に、テーブルの分離の概念を理解するのが難しいと言われています。私の提案は、これまでに学んだことをすべて忘れて、最初から始めてくださいということです。

についての私の弟子の質問に戻りますが、これは .html ファイル内に存在しますが、現在空のコンテンツである場合は、画像を挿入してください。コードは次のようになります

今ブラウザでプレビューすると、私だけが見ることができます写真を撮ると、位置が間違っています。

のクラス b が css 呼び出しを実装するようにします。 margin-top:15px;}{} 内の内容は、xhtml ファイル内の画像の表示スタイルを制御するものです: 幅 450 ピクセル、高さ 500 ピクセル、マージン 15 ピクセル、内容とスタイルが記述されています。どうすればよいですか?この 2 つを 1 つに結合するのはどうでしょうか?

を xhtml ファイルの に挿入します。

1 つはコンテンツ、もう 1 つはスタイルです。スタイルシートがなければ、コンテンツは「醜い」ものになります。

これで最初の章は終わりました。コンテンツとスタイルの分離の概念は明確に理解できたでしょうか。