ウェブデザイン研究における XHTML の応用の概要

ウェブデザイン研究における XHTML の応用の概要
<br />一般的に、「標準的な Web ページ」のファイル構成は XHTML CSS です。 XHTML は主に Web ページの構造を表現し、コンテンツを表示するために使用され、CSS は構造レイアウトを定義し、コンテンツ スタイルを変更するために使用されます。
レイアウトによく使用される XHTML には、通常、次のものが含まれます。
DIV: 主にページ コンテンツの論理的な分割に使用されます。たとえば、Web ページには通常、ヘッダー、ナビゲーション、サイドバー、コンテンツ、著作権、その他の責任パーティションが含まれます。このとき、DIV タグを使用して分割することができます。
同時に、各ブロックには次の命名が推奨されます。
引用内容は以下のとおりです。
ヘッド: <div id="masthead"></div>
ナビゲーション: <div id="globalnav"></div>
サイドバー: <div id="navbar"></div>
コンテンツ: <div id="content"></div>
著作権: <div id="copyright"></div>
注意: ID は一意です。つまり、同じページに ID が 2 回以上表示されることはありません。それ以外の場合はクラスを使用します。
ul: 元々は順序なしリストでしたが、XHTML CSS アプリケーションでは構造的に同等でない要素を表すためによく使用されます。 UL の子要素 ​​LI と一緒に使用する必要があります。
引用内容は以下のとおりです。
<div>
<ul>
<li><a href="#">リンク1</a></li>
<li><a href="#">リンク2</a></li>
<li><a href="#">リンク3</a></li>
</ul>
</div>
span: この要素を DIV と比較すると、span はバッグで、div はボックスです (Xiaoyi: XHTML コードの基本的な応用より)。実際、div はブロック レベル要素であり、span はインライン要素です (インライン要素とブロック レベル要素を参照)。span は、セクション内の要素のフラグメントまたは要素の行を個別に定義するために使用できます。
例えば:
引用内容は以下のとおりです。
<ul>
<li><span>(2006-11-13)</span>XHML CSS レイアウトにおける XHTML の適用の概要</li>
</ul>
CSS で span を左/右フローティングとして定義すると、日付とタイトルを両側に表示できます。これは比較的よく使われる
引用内容は以下のとおりです。
<ul>
<li>2007-11-5jb51.net</li>
<li>XHML CSS レイアウトの概要</li>
</ul>
ずっとシンプルです。
=======================================
レイアウトに使用される一般的な XHTML タグについて説明しましたが、Web ページのコンテンツを表示するために使用される XHTML タグもあります。例えば:
引用内容は以下のとおりです。

<img src="" alt="" title="" /> は画像を表します
<a href="" title=""></a> はハイパーリンクを示します
<hn></hn>(n=1,2,...,6) はページ コンテンツのタイトルを示します。h1 から h6 は重要度の降順で推奨され、h1 が最も重要なタイトルです (greengnn: div css 命名リファレンスを参照)
太字と斜体の元の <b></b> タグと <i></i> タグは、<strong></strong> タグと <em></em> タグに置き換えられます。

<<:  Dockerイメージ解析ツールのダイブ原理解析

>>:  Ajax リクエストにおけるクロスドメイン問題の原因と解決策

推薦する

パフォーマンス負荷診断にMySQLシステムデータベースを使用する方法

ある達人がかつて、自分の妻のことを知るのと同じくらい、自分が管理するデータベースのことを知るべきだと...

シンプルなHTMLとCSSの使い方の詳細な説明

HTML と CSS を含む JD.com のホームページの静的ページ効果を 3 日間で完成させます...

Raspberry PiにDockerをインストールする方法

Raspberry Pi は ARM アーキテクチャをベースとしているため、Docker のインスト...

Reactでwindow.print()を使用した際にページが応答しなくなる問題の解決記録について

目次1. 問題の背景: 2. 問題の原因: 3. 問題解決:要約: 1. 問題の背景: window...

Linux インストール Redis 実装プロセスとエラー解決

今日、redis をインストールしたところ、今までになかったいくつかのエラーが発生しました。ここで記...

MySQLバックアップとリカバリの実践に関する詳細な説明

1. mysqlbackup の紹介mysqlbackup は、MySQL Enterprise B...

LinuxサーバにおけるNginxとApacheの共存の実装方法の分析

この記事では、Linux サーバー上で Nginx と Apache の共存を実装する方法について説...

MySQL 検査スクリプト (必読)

以下のように表示されます。 #!/usr/bin/env python3.5 psutilをインポー...

モバイルウェブ画面適応(rem)

序文最近、フロントエンドの学習に関する以前のメモを整理したところ、モバイル Web 画面の適応 (r...

React.js フレームワーク Redux 基本ケースの詳細な説明

react.js フレームワーク Redux https://github.com/reactjs/...

Linux で最も頻繁に使用されるターミナル コマンドのトップ 10 のリストを取得します。

私が最も頻繁に使用するコマンドは次の通りです:選択肢CDギットls ssh須藤数週間前、私はこの R...

Javascriptの基本を詳しく説明

目次変数データ型拡張ポイント要約する変数基本的な構文 var age=10; //ageという変数を...

Nginx サービスを使用してサブドメイン環境を構築し、2D マップの読み込みパフォーマンスを向上させる方法を説明します。

1. 背景最近、友人が大規模なマップの読み込みが遅いという問題に遭遇しました。iServer のパ...

MYSQLのバックアップデータのスケジュールクリアの特定の操作

1|0 背景プロジェクトの要件により、各月の履歴在庫データをアーカイブしてバックアップする必要があり...

サーバー上でjupyterノートブックを実行する問題を解決する

目次サーバーはjupyterノートブックを実行します仮想環境次にファイアウォールをオフにしますJup...