検索

ダウンロード  >  学習リソース  >  Webページ制作

「HTML5とCSS3の基礎チュートリアル8」
分類する：Webページ制作表示＃ヒョウジ＃：3075882ダウンロード：301

導入

更新時間：2017-12-18
Webページ制作「HTML5とCSS3の基礎チュートリアル8」
第 1 章、Web ページの構成要素

Web ページは主に 3 つの部分で構成されます:

1. テキスト内容（プレーンテキスト）
2. 他のファイルへの参照: 画像、音声、ビデオ、スタイルシートファイル、js ファイル
3. マークアップ: テキストの内容を説明し、引用が正しく機能することを確認します。 注: これらのコンポーネントはすべてテキストのみで構成されています
基本的な HTML ページ

HTML では、< ,> を使用して HTML タグを囲みます。開始タグ (<head> など) は要素の始まりを示し、終了タグ (</head>) は要素の終わりを示すために使用されます。 ページトップとヘッダー
<body>開始タグより上の内容はブラウザと検索エンジン用に用意されています。 <!DOCTYPE html> 部分は、これが HTML5 ページであることをブラウザーに伝えます。
注: DOCTYPE は常にページの最初の行に配置する必要があります
次は <html> 要素で、ページの残りの部分が含まれます。次に ドキュメント ヘッダー、、 がドキュメントの先頭にあります。 <br /> タグ: 要素、属性、値、その他<br /> <br /> タグの構成: 要素、属性、値<br /> 注: ラベルには小文字の <br /> を使用するのが一般的です。 注: 属性値を囲む引用符はオプションです。これらを記述することをお勧めします。属性名 <br /> を記述するには小文字を使用してください。 親要素、子要素<br /> 要素に別の要素が含まれる場合、その要素は含まれる要素の親要素となり、含まれる要素は子要素と呼ばれます。 <br /> 注: 必ず正しくネストしてください。例: <br /> <div> <p></p> </div><br /> 次のようにネストすることはできません。問題が発生します。<br /> <br /></div><div class="softIntroTip"><div class="tit">声明： <!-- <img src="/static/front/mobimages/mnewphpbg4.png" alt=""> --></div><p>当サイトのすべてのリソースはネットユーザーが投稿したり、各ダウンロードステーションを転載したりしているので、ソフトウェアの完全性を自分でチェックしてください！当サイトのすべてのリソースは学習と参考のためだけに使用されます。ビジネス用途には使用しないでください。そうしないと、発生したすべての結果はあなた自身が負担します！権利侵害がある場合は、次の連絡先に連絡してください。admin@php.cn</p></div></div></div><div class="nphpZbktBox"><div class="nphpZxkcIn"><div class="nphpZbktTitle"><h2>関連する推奨事項</h2><em><a href="https://m.php.cn/ja/xiazai/learn/webmake" title="続きを見る" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ul class="recomArtList"><li><span><i class="time"></i>01-02</span><a href="https://m.php.cn/ja/xiazai/learn/5624" class="aBlack">phpcms 開発 PDF でよく使用されるタグ</a><div class="clear"></div></li><li><span><i class="time"></i>03-02</span><a href="https://m.php.cn/ja/xiazai/learn/4442" class="aBlack">『ネットワーク管理者チュートリアル』第4版</a><div class="clear"></div></li><li><span><i class="time"></i>02-12</span><a href="https://m.php.cn/ja/xiazai/learn/4220" class="aBlack">PHP初心者必見のサンプル</a><div class="clear"></div></li><li><span><i class="time"></i>03-02</span><a href="https://m.php.cn/ja/xiazai/learn/4443" class="aBlack">詳細なネットワーク設計と実装計画 (写真とテキスト付き)</a><div class="clear"></div></li><li><span><i class="time"></i>01-09</span><a href="https://m.php.cn/ja/xiazai/learn/3375" class="aBlack">AJAX（使い方まとめ・エッセンス版）</a><div class="clear"></div></li></ul></div></div><div class="nphpZbktBox"><div class="nphpZxkcIn"><div class="nphpZbktTitle"><h2>最近の更新</h2><em><a href="https://m.php.cn/ja/xiazai" title="続きを見る" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ul class="recomArtList"><li><span><i class="time"></i>05-09</span><a href="https://m.php.cn/ja/xiazai/learn/8208" class="aBlack">ThinkPHP6 バックエンド管理支払いシステム - 実践的な開発コースウェア</a><div class="clear"></div></li><li><span><i class="time"></i>11-06</span><a href="https://m.php.cn/ja/xiazai/learn/8207" class="aBlack">PHP+MySQL 基礎入門コース コースウェア</a><div class="clear"></div></li><li><span><i class="time"></i>11-06</span><a href="https://m.php.cn/ja/xiazai/learn/8206" class="aBlack">HTML5CSS3JavaScriptES6 入門コースのコースウェア</a><div class="clear"></div></li><li><span><i class="time"></i>09-21</span><a href="https://m.php.cn/ja/xiazai/learn/8150" class="aBlack">WeChat ミニ プログラム 会計帳簿開発 実践的なコースウェア</a><div class="clear"></div></li><li><span><i class="time"></i>08-15</span><a href="https://m.php.cn/ja/xiazai/learn/8092" class="aBlack">ThinkPHP 構成開発と CMS バックエンドの実践的なコースウェア</a><div class="clear"></div></li></ul></div></div><div class="nphpZbktBox"><div class="nphpZxkcIn"><div class="nphpZbktTitle"><h2>最新のコース</h2><em><a href="https://m.php.cn/ja/course.html" title="続きを見る" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ul class="newClassList"><li><a href="https://m.php.cn/ja/course/1648.html" class="img_box"><img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" onerror="this.onerror='';this.src='/static/front/mobimages/moren/236_132.png'" alt="[Web フロントエンド] Node.js クイック スタート"></a><dl><dt><a href="https://m.php.cn/ja/course/1648.html" class="aBlack">[Web フロントエンド] Node.js クイック スタート</a></dt><dd>このコースは初心者向けに特別に設計されており、学生が Node.js の基本知識とコア テクノロジを迅速に習得できるようにすることを目的としています。このコースは、Node.js のインストールと環境構成から始まり、徐々にその非同期プログラミング モデル、モジュール システム、イベント駆動メカニズムを詳しく分析します。豊富な実践事例を通じて、学生は Node.js を使用して効率的で安定した Web サーバーを構築し、HTTP リクエストと応答を処理し、ファイル操作とデータベース対話を実行する方法を学びます。さらに、このコースでは、フロントエンド開発における Node.js の典型的なアプリケーション シナリオも紹介し、学生が実践的な能力を迅速に向上させ、フロントエンド開発の課題に簡単に対処できるようにします。</dd></dl></li><li><a href="https://m.php.cn/ja/course/1647.html" class="img_box"><img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" onerror="this.onerror='';this.src='/static/front/mobimages/moren/236_132.png'" alt="海外のWeb開発フルスタックコースの完全なコレクション"></a><dl><dt><a href="https://m.php.cn/ja/course/1647.html" class="aBlack">海外のWeb開発フルスタックコースの完全なコレクション</a></dt><dd>このコースは、HTML、CSS、JavaScript、Vue.js、React、Flutter、モバイル APP 開発をカバーする包括的なチュートリアルです。基本的な Web ページ制作から、複雑なフロントエンドとバックエンドの対話、モバイル アプリケーションの実践的な開発まで、コースは内容が豊富で非常に実践的です。一連の実践的なプロジェクトを通じて、さまざまな開発スキルを深く理解し習得し、フルスタック開発エンジニアとして早期に成長します。初心者も経験豊富な開発者も、その恩恵を受けることができます。このコースの学習を通じて、Web アプリケーションやモバイル アプリケーションを独自に開発する能力を身につけ、将来のキャリア開発のための強固な基盤を築きます。</dd></dl></li><li><a href="https://m.php.cn/ja/course/1646.html" class="img_box"><img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" onerror="this.onerror='';this.src='/static/front/mobimages/moren/236_132.png'" alt="Go言語実践GraphQL"></a><dl><dt><a href="https://m.php.cn/ja/course/1646.html" class="aBlack">Go言語実践GraphQL</a></dt><dd>このコースは、学習者が Go 言語を使用して GraphQL サービスを実装する方法を習得できるように設計されています。このコースでは、GraphQL の基礎知識から始まり、そのデータ クエリ言語の特性と利点を深く分析し、Go 言語の特性と組み合わせて、GraphQL サーバーの構築方法、リクエストの処理方法、データの定義方法を詳しく説明します。パターンなど豊富な実践事例を通じて、学習者は実際のプロジェクトに GraphQL を統合してデータ インタラクションの柔軟性と効率を向上させる方法を学びます。このコースは、Go 言語の一定の基礎を備えた開発者に適しており、効率的で最新の API を構築するために必須のコースです。</dd></dl></li><li><a href="https://m.php.cn/ja/course/1645.html" class="img_box"><img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" onerror="this.onerror='';this.src='/static/front/mobimages/moren/236_132.png'" alt="550W ファンマスターが JavaScript をゼロから段階的に学習します"></a><dl><dt><a href="https://m.php.cn/ja/course/1645.html" class="aBlack">550W ファンマスターが JavaScript をゼロから段階的に学習します</a></dt><dd>このコースは初心者向けに特別に設計されており、Google の責任者が指導します。このコースは JavaScript の基礎知識から始まり、構文、関数、オブジェクト、イベント処理などをカバーして徐々に深めていきます。鮮やかな事例と実践的な演習を通じて、学生は JavaScript のコアスキルをすぐに習得できます。上司が直接学生の質問に答え、プログラミング体験を共有することで、学生はリラックスした楽しい雰囲気の中で JavaScript マスターに成長することができます。プログラミングの初心者であっても、スキルを向上させたい開発者であっても、このコースは JavaScript を学習するための最良の選択となるでしょう。</dd></dl></li><li><a href="https://m.php.cn/ja/course/1644.html" class="img_box"><img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" onerror="this.onerror='';this.src='/static/front/mobimages/moren/236_132.png'" alt="Python マスター Mosh、基礎知識ゼロの初心者でも 6 時間で始められる"></a><dl><dt><a href="https://m.php.cn/ja/course/1644.html" class="aBlack">Python マスター Mosh、基礎知識ゼロの初心者でも 6 時間で始められる</a></dt><dd>このコースでは、プログラミングの旅に出かけます。ゼロから始めるこの 6 時間のコースでは、Python の基礎と高度な概念について説明します。 あなたが初心者であっても、スキルを向上させたい経験豊富なプログラマであっても、Mosh の詳細な説明と明確な指導方法により、Python をすぐに使いこなすことができます。変数、データ型、条件文、ループ、関数、オブジェクト、モジュールについて詳しく学び、実践的な演習で理解を深めます。 このコースは、Python を学習し、さまざまなキャリア分野への準備を整えるのに最適です。 Mosh の専門知識と教育に対する情熱により、熟練した Python 開発者への道を自信を持って歩み始めることができます。</dd></dl></li></ul></div></div></div><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！</p></div><div class="footermid"><a href="https://m.php.cn/ja/about/us.html">私たちについて</a><a href="https://m.php.cn/ja/about/disclaimer.html">免責事項</a><a href="https://m.php.cn/ja/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div></body></html>