目次
Mokka mit Schlag" >Mokka mit Schlag
ホームページ ウェブフロントエンド H5 チュートリアル HTML5 の構造とセマンティクス (2): Structure_html5 チュートリアルのスキル

HTML5 の構造とセマンティクス (2): Structure_html5 チュートリアルのスキル

May 16, 2016 pm 03:51 PM
div href 構造 セマンティクス


たとえ整形式の HTML ページであっても、構造が不足しているために処理が難しい場合があります。セクションがどのように分割されているかを確認するには、見出しのレベルを分析する必要があります。サイドバー、フッター、ヘッダー、ナビゲーション バー、メイン コンテンツ領域、および個々の記事はすべて、共通の div 要素で表されます。 HTML 5 では、特にこれらの一般的な構造を識別するために、いくつかの新しい要素が追加されています。
· セクション: これは本の章またはセクションであり、実際には HTML 4 で独自のタイトルを持つものであれば何でも
· ヘッダー: head 要素とは別にページに表示されるヘッダー。同じ
· footer: フッター; 電子メールに署名を表示できます
· nav: 他のページへのリンクのセット
· Article: ブログ、雑誌、記事まとめなどの記事。
上部にヘッダー、下部にフッター、いくつかの記事、ナビゲーション領域、サイドバーがある典型的なブログのホームページについて考えてみましょう。典型的なブログ ページのコード 1 を参照してください。


Mokka mit Schlag







"/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/">
サセックス郡に春が来る (そして去っていく)



昨日、私はブルックリンバードクラブに参加して、ニュージャージー州西部への
毎年恒例の旅行、特に比較的最近発見されたホットスポットであるハイパー
腐植土
から始まりました。午前7時30分に現場に到着したときは、気持ちの良い冬の朝でした。
午前10時頃には春になり、


には初夏になりました。



"/blog/birding/2007/04/23/but-does-it-count-for-your-life -list/"> でも、それはあなたの人生リストに含まれますか?


これで href="http: //www.wired.com/science/discoveries/news/ 2007/04/cone_sf">インターネット経由の野鳥観察
。私はまだテストできていません (20 ユーザー
どうやら限界のようです) しかし、これは確かにクールです。
個人的には、これが実際にフィールドに出ている
に少しでも置き換えられるとは想像できません。
一方、私は常に
双眼鏡を安定して持つことができなくなったり、公園に行くことができなくなった先輩野鳥観察者たちに会うのはとても
悲しいことです。
少なくとも 1 人は、これが何らかの興味を持っているのではないかと想像できます。年老いた野鳥観察者は、
あまり外に出られなくなって以来、テレビで大活躍しましたが、これは間違いなく
それを上回ります。











インデントが正しくても、これらのネストされた div は依然として非常に混乱しているように感じられます。 HTML 5 では、これらの要素をセマンティック要素に置き換えることができます。HTML5 で書かれた典型的なブログ ページについては、コード 2 を参照してください。


Mokka mit Schlag



Mokka mit Schlag





"/blog/birding/2007/04 /23/spring-comes-and-goes-in-sussex-county/">
サセックス郡に春が来る (そして去っていく)


昨日、私はブルックリン バード クラブに参加しましたニュージャージー州西部への
毎年恒例の旅行、特に比較的最近発見されたホットスポットであるハイパー
腐植土への旅行
は、私たちが現場
に7時半に到着したときから始まりました。午前10時
頃から春に進み、




"/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/">
でも、それはあなたの人生リストに含まれますか?


href="http://www.wired.com/science/discoveries/news/
2007/04/cone_sf">インターネット経由で野鳥観察ができるようです。私
はまだテストできていませんが (どうやら 20 ユーザー
制限があるようです)、これは確かに素晴らしいです。
個人的には、これが実際にリリースされる
に代わるとは想像できません。
その一方で、双眼鏡をしっかり持つことができなくなったり、公園に行くことができなくなった先輩野鳥観察者たちに会うのは
いつもとても悲しいことです。
少なくとも一人の年配の野鳥観察者がテレビで大活躍したのに、
もうあまり外出できなくなってしまったのは間違いなく
です。






著作権 2007 Elliotte Rusty Harold




これで div は必要なくなりました。 class 属性を自分で設定する必要はなくなり、各部分の意味は標準の要素名から推測できます。これは、オーディオ ブラウザ、モバイル ブラウザ、その他の非標準ブラウザにとって特に重要です。
(続く)
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

src と href は何を意味しますか? src と href は何を意味しますか? Aug 16, 2023 pm 05:00 PM

src と href はそれぞれ、1. src は、source の略語で、外部リソースのパスを指定するために使用されます。通常、画像、オーディオ、ビデオなどの外部ファイルを埋め込むために使用されます。src 属性は通常、 img、script、iframe などのタグで使用されます。 ; 2. href は、ハイパーテキスト参照の略で、ハイパーリンクのターゲット リソースのパスを指定するために使用されます。通常、外部ドキュメントまたは他のページへのリンクに使用されます。 href 属性は通常、a や link などのタグで使用されます。

CSSを使用してdivの角が欠けていることを認識する方法 CSSを使用してdivの角が欠けていることを認識する方法 Jan 30, 2023 am 09:23 AM

div の角が欠けていることを認識するための CSS メソッド: 1. HTML サンプル ファイルを作成し、div を定義します; 2. div の幅と高さの背景色を設定します; 3. 削除する必要がある div に疑似クラスを追加します隅に配置し、擬似クラスを背景色と同じ色を使用するように設定し、45 度回転して、削除する必要がある隅に配置します。

ラムダ式の構文と構造の特徴は何ですか? ラムダ式の構文と構造の特徴は何ですか? Apr 25, 2024 pm 01:12 PM

ラムダ式は名前のない匿名関数であり、その構文は (parameter_list)->expression です。匿名性、多様性、カリー化、閉鎖性が特徴です。実際のアプリケーションでは、ラムダ式を使用して、合計関数 sum_lambda=lambdax,y:x+y などの関数を簡潔に定義し、map() 関数をリストに適用して合計演算を実行できます。

ChatGPT APIに基づくワードマーキング翻訳ブラウザスクリプトの実装 ChatGPT APIに基づくワードマーキング翻訳ブラウザスクリプトの実装 May 01, 2023 pm 03:28 PM

はじめに 最近 GitHub に ChatGPTAPI をベースにしたブラウザスクリプト openai-translator が登場しました 短期間でスターが 12k に達しました 翻訳だけでなく磨きや要約機能もサポートしています ブラウザプラグに加えて-ins, tauri パッケージも使用します。デスクトップ クライアントをお持ちの場合は、tauri が Rust 部分を使用するという事実を除けば、ブラウザ部分の実装はまだ比較的簡単です。今日は手動で実装します。 openAI によって提供されるインターフェイス。たとえば、次のコードをコピーし、ブラウザ コンソールでリクエストを開始して変換を完了できます。 //Example constOPENAI_API_KEY="s

MySQL.proc テーブルの構造と目的の詳細な分析 MySQL.proc テーブルの構造と目的の詳細な分析 Mar 15, 2024 pm 02:36 PM

MySQL.proc テーブルは、MySQL データベースにストアド プロシージャと関数の情報を格納するシステム テーブルです。その構造と目的を深く理解することで、MySQL のストアド プロシージャと関数の動作メカニズムをより深く理解し、関連する実行を行うことができます。管理と最適化。 MySQL.proc テーブルの構造と目的については以下で詳しく分析し、具体的なコード例を示します。 1. MySQL.proc テーブルの構造 MySQL.proc テーブルは、すべてのストアド プロシージャと関数の定義と関連情報を格納するシステム テーブルです。

インターネットの基本構造と技術の起源は何ですか? インターネットの基本構造と技術の起源は何ですか? Dec 15, 2020 pm 04:48 PM

インターネットの基本構造と技術はARPANETから生まれました。 ARPANETはコンピュータネットワーク技術発展のマイルストーンであり、その研究成果はネットワーク技術の発展を促進する上で重要な役割を果たし、インターネット形成の基礎を築きました。 Arpanet (Arpanet) は、米国国防高等研究計画局によって開発された世界初の実用的なパケット交換ネットワークであり、グローバル インターネットの祖先です。

divとspanの違いは何ですか? divとspanの違いは何ですか? Nov 02, 2023 pm 02:29 PM

違いは次のとおりです: 1. div はブロックレベル要素であり、span はインライン要素です。2. div は自動的に行を占有しますが、span は自動的に折り返されません。3. div はより大きな構造とレイアウトを折り返すために使用されます。テキストまたは他のインライン要素をラップするために、span が使用されます。4. div には他のブロックレベル要素とインライン要素を含めることができ、span には他のインライン要素を含めることができます。

divボックスモデルとは何ですか divボックスモデルとは何ですか Oct 09, 2023 pm 05:15 PM

div ボックス モデルは、Web ページのレイアウトに使用されるモデルです。Web ページ内の要素を長方形のボックスとして扱います。このモデルには、コンテンツ領域、パディング、ボーダー、マージンの 4 つの部分が含まれています。 div ボックス モデルの利点は、Web ページのレイアウトと要素間の間隔を簡単に制御できることであり、コンテンツ領域、内側の余白、境界線、外側の余白のサイズを調整することで、さまざまなレイアウト効果を実現できます。ボックス モデルには、CSS と JavaScript を通じてボックスのスタイルと動作を動的に変更できるいくつかのプロパティとメソッドも用意されています。

See all articles