HTML Webページ制作テンプレートコードの書き方-htmlチュートリアル-php.cn

HTML Webページ制作テンプレートコードの書き方

下次还敢

リリース： 2024-04-05 11:30:23

オリジナル

974 人が閲覧しました

HTML テンプレートコードは、Web ページの基本的なスケルトンを作成するために使用される事前に記述されたコード構造であり、ページ構造、タイトル、本文、ナビゲーションバー、およびフッターを定義する共通のマークアップが含まれています。 HTML テンプレートコードの記述手順は次のとおりです: 1. テキストファイルを作成します; 2. を追加します; 3. とを追加します; 4. タイトルを追加します; 5. 本文を追加しますテキスト; 6. フッターを追加; 7. ナビゲーションバーを追加 (オプション); 8. ファイルを保存します。

HTML Webページ制作テンプレートコードの書き方

#HTML Web ページ制作テンプレートコード記述ガイド

1. HTML テンプレートコードとは何ですか?

HTML テンプレートコードは、Web ページを作成するための基本的なフレームワークを提供する、事前に作成されたコード構造です。これには、ページ構造、タイトル、本文、ナビゲーションバー、およびフッターを定義するための共通のマークアップが含まれています。

2. HTML テンプレートコードの記述方法

1. テキストファイルの作成

テキストエディター (たとえば、 Notes 、Sublime Text または Atom として) を使用して、新しいテキストファイルを作成します。

を追加します。これは HTML ドキュメントの宣言であり、ページが使用していることをブラウザーに伝えます。 HTML5標準。

<code class="html"><!DOCTYPE html></code>

ログイン後にコピー

3. と

を追加します。 要素は HTML ページの最上位要素であり、 要素にはページの実際のコンテンツが含まれます。

<code class="html"><html>
<body>
</body>
</html></code>

ログイン後にコピー

4. タイトルの追加

要素を使用して、通常はブラウザに表示されるページタイトルを追加します。タブ。

<code class="html"><head>
  <title>HTML 模板</title>
</head></code>

ログイン後にコピー

5. テキストの追加

要素を使用して、テキストコンテンツの表示に使用されるページテキストを追加します。

<code class="html"><p>这是模板代码创建的正文内容。</p></code>

ログイン後にコピー

6. フッターを追加します

 要素を使用してフッターを追加します。フッターには通常、著作権情報または他のページが含まれます。情報。

<code class="html"><footer>
  <p>© 2023 我的网站</p>
</footer></code>

ログイン後にコピー

7. ナビゲーションバーの追加 (オプション)

要素を使用して、ナビゲーションバーを追加します。ページに

<code class="html"><nav>
  <ul>
    <li><a href="home.html">主页</a></li>
    <li><a href="about.html">关于</a></li>
    <li><a href="contact.html">联系</a></li>
  </ul>
</nav></code>

ログイン後にコピー

8. ファイルを保存します

ファイルを、「template.html」などの拡張子

.html を持つファイルとして保存します。

サンプルテンプレートコード

<code class="html"><!DOCTYPE html>
<html>
<head>
  <title>HTML 模板</title>
</head>
<body>
  <h1>我的网站</h1>
  <nav>
    <ul>
      <li><a href="home.html">主页</a></li>
      <li><a href="about.html">关于</a></li>
      <li><a href="contact.html">联系</a></li>
    </ul>
  </nav>
  <p>这是模板代码创建的正文内容。</p>
  <footer>
    <p>© 2023 我的网站</p>
  </footer>
</body>
</html></code>

ログイン後にコピー

以上がHTML Webページ制作テンプレートコードの書き方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。