CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

HTMLとCSSの違い

この投稿では、HTMLとCSSの違いを理解します

HTML

  • ハイパーテキストマークアップ言語を指します。

  • Webページとアプリケーションの作成に役立ちます。

  • Webページの構造を定義するのに役立ちます。

  • マークアップ言語です。

  • 静的ページの作成にも役立ちます。

  • データの表示に役立ちます。

  • ハイパーテキストは、複数のWebページ間のリンクを定義するのに役立ちます。

  • マークアップ言語は、タグを使用してテキストドキュメントを定義するのに役立ちます。これにより、Webページに構造が与えられます。

  • バックアップとサポートのオプションが少なくなります。

  • HTMLはCSSシート内では使用できません。

  • システムがテキストを理解して使用できるように、テキストに注釈を付けるのに役立ちます。

  • HTMLには特定の数のタグがあります。

  • これらのタグは事前定義されています。

  • データはタグで囲まれています。

  • タグを閉じる必要はありません。

HTMLの例-

例

<!DOCTYPE html>
<html>
<head>
   <title>My title</title>
</head>
<body>
   <h1>title</h1>
   <p>A sample</p>
</body>
</html>

出力

HTMLとCSSの違い

CSS

  • Webページのスタイル設定に役立ちます。

  • 同じことを実現するために、さまざまなスタイリング機能を使用しています。

  • 「セレクター」と「宣言ブロック」を使用します。

  • 手元の要件に応じて、外部ファイルまたは内部ファイルにすることができます。

  • CSSはHTMLドキュメント内で使用できます。

  • データの表示に使用できます。

  • HTMLと比較して、より高いバックアップとサポートがあります。

CSSの例-

例

<style>
p {
   color: pink;
   text-align: left;
}
</style>

  1. CSS表示と可視性の違い

    CSSVisibilityプロパティとCSSDisplayプロパティをそれぞれ使用して、HTMLドキュメント内の要素を非表示または削除できます。ユーザーには、2つのプロパティのいずれを使用しても違いはないように見えるかもしれませんが、違いはあります。 CSSディスプレイ − noneはドキュメント上の要素をレンダリングしないため、スペースを割り当てません。 CSSの可視性 − hiddenはドキュメント上の要素をレンダリングし、スペースも割り当てられますが、ユーザーには表示されません。 例 CSS表示の例を見てみましょうなし- <!DOCTYPE html> <html

  2. CSSの疑似クラスと疑似要素の違い

    疑似クラス 疑似クラスは、：hover、：active、：last-childなどのセレクターの状態を表します。これらは単一のコロン（:)で始まります。 CSS疑似クラスの構文は次のとおりです- :pseudo-class{ attribute: /*value*/ } 疑似要素 同様に、疑似要素は、::after、::before、::first-lineなどの仮想要素を選択するために使用されます。 これらは二重コロン（::）で始まります。 CSS疑似要素の構文は次のとおりです- ::pseudo-element{ attribute: /*value*/ } 例 次