言うまでもなく、Web開発は巨大です。 その大部分は、ほぼ全員がWeb上にいるためです。 ただし、この分野では開発者が不足しているため、Web開発カリキュラムも非常に簡単に入手でき、無料です。 これを念頭に置いて、HTMLとCSSのすべてについて少し説明します。 より具体的には、「クラス」がどのように機能するかを示します。
すでに無料のカリキュラムがたくさんあるので、最初からあなたを始めるわけではありません。 代わりに、Webサイトのスタイル設定に必要なコンポーネントであるため、クラスがどのように機能するかを具体的に示します。 また、TwitterのBootstrap APIを見る前に、クラスも必須コンポーネントであるため、カバーする価値があると考えました。
免責事項として、もしあなたがHTMLとCSSに完全に慣れていないなら、これはおそらくあなたにとって良いスタートではありません。 あなたがそれに精通していれば、しかし、それを拾うのはそれほど難しくないはずです。 しかし、完全な初心者向けのチュートリアルを探している場合は、オンラインで多くの素晴らしいオプションがあります。 いくつか例を挙げると、FreeCodeCamp、The Odin Project、CodeAcademy、Code School、Team Treehouse、Udacityなどがあります。 これらのいずれかを掘り始めることを選択した場合、多くの「基本的な」コンテンツはかなり繰り返される可能性があるため、1つ（Free Code Campなど）に固執し、別のものを開始する前に終了することを強くお勧めします。
それが邪魔にならないように、クラスがすべてであるものについて掘り下げましょう。
クラスの仕組み
クラスは非常に便利です。 HTMLのスタイリングから反復性を取り除きます。 クラスがなければ、マークアップの各要素を個別にスタイルすることになります。 また、2つの同じ要素があり、それぞれを異なるスタイルにしたい場合はどうでしょうか。 それは完全な混乱です。 それがクラスがある理由です。 クラスはHTMLに何らかの組織構造を追加するため、コードを比較的きれいに保つことができます。 それだけでなく、クラスは複数回使用できます。 つまり、同じスタイリングルールを2回作成する必要はありません。
クラス内のクラスは次のとおりです。
鬼ごっこ：
ご覧のとおり、bodyタグの下に2つの
異なるクラスの要素。 最初タグにはクラス「head1」があり、2番目のタグにはクラス「head2」があります。したがって、CSSでは、スタイリングを要素の場合、これらの個々のクラスにスタイルを適用できます。 なぜそうするのでしょうか？
要素の場合、これらの個々のクラスにスタイルを適用できます。 なぜそうするのでしょうか？
主な理由は、あなたがすべてを望んでいないことです
同じスタイルを持つ要素。 ウェブサイトを作成するとき、それは多くの頭痛の種を作成します、そして、それに加えて、ウェブサイトはあまり良く見えません。 クラスを使用すると、すべてではなく、タグの1つのインスタンスだけにスタイルを適用できますドキュメント全体のタグ。 では、クラスをHTMLでどのように記述しますか？ このような：
一部のコンテンツ
ほとんどのHTML要素に「クラス」プロパティを追加できます。
すばらしいです！ クラスはありますが、現在の状態では、実際には何もしていません。 これは、クラスにスタイル設定ルールをまだ追加していないためです。 そのためには、別の.cssドキュメントを作成する必要があります。 これをmain.cssと呼びます。 そのドキュメントでは、次のようなクラスをスタイルします。
スタイルを設定するクラスを選択するには、次のようにします。
.head1 {色：赤; text-align：center; }
中括弧内には、そのクラスに適用されるすべての「ルール」（またはスタイリング）があります。 そのクラス内に配置できるさまざまなルールがたくさんあります。 私の場合、「色」ルールを使用してテキストの色を赤に変更し、「テキスト整列」ルールを使用してテキストを中央揃えにしました。 Mozillaの開発者ネットワークから、CSSルールの完全なリストとそのドキュメントを見つけることができます。
現在、スタイリングはまだHTMLドキュメントのクラスに適用されていません。これは、2つのファイルをまだリンクしていないためです。 HTMLファイルに戻り、
タグを使用して、CSSファイルをリンクするには次のようにします。
HTMLドキュメントは次のようになります。
そして、テストプロジェクトはWeb上で次のようになります。
これらの手順を詳しく説明したビデオについては、以下をご覧ください。
ビデオ
結論
そして、クラスにあるのはそれだけです！ とても簡単に理解できます。 訪問する大規模で人気のあるWebサイトでは明らかに、クラス内のルールは、ここで説明したものよりもはるかに複雑ですが、最も基本的な形式では、それがどのように機能するかです。
質問がある場合、または長い間問題が発生した場合は、PCMechフォーラムの以下のコメントでお知らせください。 または、PCMechの完全なHTML / CSS初心者ガイドに興味がある場合は、それもお知らせください。
