DIVとSPANの違い

Anonim

の間に定義されたテキスト(内容) HTMLコード内の要素を定義するHTMLタグです。

HTML (Hypertext Markup Language)は、あらゆるデバイス上でオンライン、毎日、訪問するWebページを構築して表示するために使用される構造化されたコードです。

他のテクノロジやプログラミング言語をHTMLと統合して、Webサイト上に動的で高度な機能を提供することができます。

<! HTMLの理解

ハイパーテキストマークアップ言語(HTML)は広く使用されているマークアップ言語であり、ウェブブラウザの中に表示されるウェブページの背後にある構造とコードを指します。

HTMLは、特定のコード(構文)を使用してページのスタイル、コンテンツ、レイアウト、およびフォーマットを定義するテキストファイルです。 マークアップ

という用語は、テキスト/コードが処理とプレゼンテーションのために準備されていることを示します。 e。ウェブページ上のウェブブラウザ上に表示される。 <! WWWコンソーシアム(W3C)[i]は、Webページ開発においてHTMLを正式なマークアップ言語として認識しているため、ほとんどのブラウザでHTMLがサポートされています。したがって、ウェブページは、認識された言語で開発され、異なるブラウザによって容易に解釈され、設計者が意図した通りにページをレンダリングすることができる。 現在使用されている現在のバージョンはHTML4ですが、徐々に段階的に廃止されています.HTML5は動的で反応性の高いWebページのサポートと採用を増やしています。

<!スマートフォン、タブレット、ラップトップなどの複数のデバイスに対応する必要がある、より簡単でよりダイナミックなユーザーエクスペリエンスを提供するために、レスポンスはWeb開発の基本要素になりつつあります。

カスケーディングスタイルシート(CSS)

は、動的で反応性のあるページを構築するための不可欠な部分になりつつあります。これは、フォント、色、配置などのすべての要素の属性を定義する別々のファイルです。開発者は、HTMLコードで使用されるたびに要素のスタイルを示すことはありません。

HTMLの基本構造

開発言語を最大限に活用するためには、標準ファイル構造を遵守し、構文の最適な使用を検討することが、安定した目的で視覚的に魅力的なWebコンテンツを提供するうえで重要です。

HTMLページは要素(タグとも呼ばれます)で定義された構造を持ちます。 HTMLコードを書くとき、これらの要素はペアで表示されます。つまり、すべてのタグには開始と終了が必要です。開始と終了。 要素は

という構文で開き、

で閉じます。

/

の斜線は、その要素の定義の終わりを示します。 要素の属性と内容は、これらの2つの点の間で定義されます。 HTMLファイルに必要な最小要素 は、定義、、(HTML4のみ)、およびタグです。 DOCTYPE定義

定義(DTD)はHTMLファイルの最初のタグとして最初に宣言されなければならないので、ページが処理されるとき、Webブラウザはそれがどのタイプのファイルであるかを知っているため、ページを表示します。

HTML4では、ページ属性と要素に依存してDTDのバリエーションがありますが、より典型的な記述は または に含まれます。HTML5のDTDははるかに単純です。 HTML、HEAD、およびBODY

  • タグはHTMLファイルであることを示します。これはHTML要素のルートであり、その中に定義されている他のすべての後続要素を含みます。言語属性を含むことがベストプラクティスとして推奨されます。例:

HTML4では必須ですが、HTML5では必須ではありません。これは、タイトル、スクリプトの参照、スタイルとメタデータの定義など、このドキュメントの一部に関連する他の要素を含む要素です。

要素は、テーブル、イメージテキスト、リストなどを含む、ページのメインコンテンツを保持します。タグが閉じられると、要素は終了します。新しいHTML5要素の使用は、ページやコンテンツの別の部分ではオプションです。

HTML要素

HTML5は、開発と設計を容易にするための新しい要素を生成し、HTML4で使用される要素も削除しました。 HTML4とHTML5の違いの一覧は、World Wide Web Consortium(W3C)[ii]によって発行されています。

HTML DIV TAG

  • CSSの進歩と相まって、機能強化や新しい要素に加えて、特定の要素を以前とは違ったより良い方法で使用することができます。見る! HTML5で使用されるCSSを使用すると、過度に使用された特定の要素を置き換えることができます。
  • このタグは、ページにコンテンツを分離するときに人気があります。この要素を作成するときには、ページ全体にテキストを表示するのではなく、テキストまたはコンテンツをまとめて保存するためにブレーク
  • が自動的に挿入されます。

ウェブサイトのアクセシビリティと検索エンジンの最適化により、テクニックはかなり科学になりつつあり、WC3がHTML5での使用に必ず戻らないように推奨しています。

きちんと構造化された単純なブログ形式の例として、要素を使用する代わりにCSSで新しいHTML5要素を考えてみましょう。ページ、ヘッダー、またはフッター(任意の場所)のコンテンツを強調表示または分離するための要素をメインコンテンツに使用し、要素を使用してメニューを保持したり、ページからブラウズするためのリンクをグループ化したりできます。

これらの新しい要素は、HTML5を使用してコンテンツタイプを簡単に識別します。しかし、このタグは、レスポンシブウェブサイトを作成するためにCSSでも使用されます。

各要素(独自のidまたはクラスを持つ)を作成すると、CSSファイルを定義して各要素を操作できます。

以下のHTMLの例は、複数の要素を使用する例を示しています。

My Examples

要素は、異なる属性、具体的には、使用されているデバイスの画面サイズによって応答する対話のサイズが異なります。

タグを参照することによって、HTMLの対応するCSSファイルで各要素のスタイルを設定する方法の例を次に示します。

#ヘッダー{

幅:800px;

height:auto

margin-left:auto;

margin-left:auto; }

#成人向け<

身長:150px;

背景色:#CCC;

}

HTML SPAN TAG

要素はインライン要素であり、break

タグが使用され、openタグとcloseタグの間に定義されたテキスト(内容)が次のように表示されない限り、行(デフォルトでは他の要素を使わずに)。

インライン要素はHTMLファイル内のテキスト要素であり、別の要素の行内で定義できます。

同様に、要素は最適な参照のために

意味を持たない

。これは基本的に要素の内容をそのまま示していますが、正しくタグ付けされ、他の属性が充実している場合や、JavaScriptで操作されている場合は、すべてのインスタンスをCSSでスタイル定義できます。

下の例では、青色のテキストは、親要素とは異なる属性を持つインライン要素としてspan要素をネストする方法を示しています。段落p>:

例を開くには、ページの

Webブラウザで見ると、上の要素のテキストは段落とは別のフォントで表示され、例にアクセスするためにユーザーがクリックしなければならない場所が強調されます。

HTML4とHTML5の間には違いはありません。