開発者ドキュメント

CSSおよびHTMLWebサイトプロジェクトを設定する方法

getdocs

序章

このチュートリアルでは、HTMLとCSSを使用してWebサイトを構築するために必要なフォルダーとファイルを設定します。 また、準備します index.html 先のチュートリアルでHTMLコンテンツを受信できるようにファイルします。

前提条件

このチュートリアルシリーズをフォローしている場合は、引き続き使用できます。 css-practice プロジェクトディレクトリ、 index.html ファイル、 images フォルダ、 css フォルダ、および styles.css シリーズの前半で作成したファイル。 このチュートリアルシリーズに従わず、これらのフォルダとファイルを設定する手順が必要な場合は、このシリーズの以前のチュートリアルCSSおよびHTML練習プロジェクトの設定方法を参照してください。

注：フォルダまたはファイルに独自の名前を作成する場合は、文字スペース、特殊文字（！、＃、％など）、大文字は避けてください。後で問題を引き起こす可能性があります。 また、このチュートリアルシリーズの残りの部分のいくつかの手順でファイルパスを変更して、ファイルの名前と一致するようにする必要があることにも注意してください。

名前の付いたプロジェクトフォルダが必要です css-practice これには、このチュートリアルシリーズでCSSを探索するために必要な次のフォルダーとファイルが含まれています。

このチュートリアルの最初のステップでは、 index.html 先のチュートリアルのコンテンツを受信できるようにファイルします。

あなたを準備する方法 index.html HTMLコンテンツのファイル

あなたを準備するには index.html あなたのウェブサイトのホームページとして機能するファイル、私たちはHTMLのいくつかの重要な行を追加する必要があります。 これらのHTML行はブラウザの指示として機能し、Webページ自体には表示されません。 あなたの index.html ファイルが空で（前のチュートリアルのコンテンツがある場合）、次のコードスニペットをドキュメントに追加します。

index.html
<!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="utf-8">
   <title>Sammy the Shark</title>
   <link rel="stylesheet" href="css/styles.css">
  </head>
  <body>
  </body>
</html>

強調表示されたサイトのタイトルを、自分で選択したタイトルに変更してください。 次に、を保存します index.html ファイル。 続行する前に、追加したコードを簡単に確認して、その目的を理解しましょう。

結論

これで、HTMLとCSSを使用してWebサイトを作成するために必要なすべてのフォルダーとファイルが作成されました。 また、 index.html あなたのウェブサイトのホームページとして機能するために必要なHTMLコンテンツで準備されたファイル。 次のチュートリアルでは、デモンストレーションサイトがどのように構築され、それを再作成するために実行する手順について説明します。

モバイルバージョンを終了