HTMLチュートリアル

HTMLホーム HTMLの紹介 HTMLエディター HTMLベーシック HTML要素 HTML属性 HTML見出し HTML段落 HTMLスタイル HTMLフォーマット HTMLの引用 HTMLコメント HTMLの色 HTML CSS HTMLリンク HTML画像 HTMLファビコン HTMLテーブル HTMLリスト HTMLブロックとインライン HTMLクラス HTMLID HTMLIframe HTML JavaScript HTMLファイルパス HTMLヘッド HTMLレイアウト HTMLレスポンシブ HTMLコンピューターコード HTMLセマンティクス HTMLスタイルガイド HTMLエンティティ HTMLシンボル HTML絵文字 HTML文字セット HTMLURLエンコード HTMLとXHTML

HTMLフォーム

HTMLフォーム HTMLフォーム属性 HTMLフォーム要素 HTML入力タイプ HTML入力属性 HTML入力フォームの属性

HTMLグラフィックス

HTMLキャンバス HTML SVG

HTMLメディア

HTMLメディア HTMLビデオ HTMLオーディオ HTMLプラグイン HTML YouTube

HTML API

HTMLジオロケーション HTMLドラッグアンドドロップ HTMLWebストレージ HTMLWebワーカー HTML SSE

HTMLの

HTMLの例 HTMLクイズ HTML演習 HTML証明書 HTMLの概要 HTMLアクセシビリティ

HTMLリファレンス

HTMLタグリスト HTML属性 HTMLグローバル属性 HTMLブラウザのサポート HTMLイベント HTMLの色 HTMLキャンバス HTMLオーディオ/ビデオ HTMLDoctypes HTML文字セット HTMLURLエンコード HTML言語コード HTTPメッセージ HTTPメソッド PXからEMへのコンバーター キーボードショートカット

HTMLファイルパス


ファイルパスは、Webサイトのフォルダ構造内のファイルの場所を示します。


ファイルパスの例

説明
<img src = "picture.jpg"> 「picture.jpg」ファイルは、現在のページと同じフォルダにあります
<img src = "images / picture.jpg"> 「picture.jpg」ファイルは、現在のフォルダのimagesフォルダにあります
<img src = "/ images / picture.jpg"> 「picture.jpg」ファイルは、現在のWebのルートにあるimagesフォルダーにあります。
<img src = "../ picture.jpg"> 「picture.jpg」ファイルは、現在のフォルダーから1レベル上のフォルダーにあります。

HTMLファイルパス

ファイルパスは、Webサイトのフォルダ構造内のファイルの場所を示します。

ファイルパスは、次のような外部ファイルにリンクするときに使用されます。

  • ウェブページ
  • 画像
  • スタイルシート
  • JavaScript

絶対ファイルパス

絶対ファイルパスは、ファイルへの完全なURLです。

<img src="https://www.w3schools.com/images/picture.jpg" alt="Mountain">

<img>タグについては、「 HTML画像」の章で説明しています


相対ファイルパス

相対ファイルパスは、現在のページを基準にしたファイルを指します。

次の例では、ファイルパスは、現在のWebのルートにあるimagesフォルダー内のファイルを指しています。

<img src="/images/picture.jpg" alt="Mountain">

次の例では、ファイルパスは現在のフォルダーにあるimagesフォルダー内のファイルを指しています。

<img src="images/picture.jpg" alt="Mountain">

次の例では、ファイルパスは、現在のフォルダーから1レベル上のフォルダーにあるimagesフォルダー内のファイルを指しています。

<img src="../images/picture.jpg" alt="Mountain">


ベストプラクティス

相対ファイルパスを使用することをお勧めします(可能な場合)。

相対ファイルパスを使用する場合、Webページは現在のベースURLにバインドされません。すべてのリンクは、現在のパブリックドメインと将来のパブリックドメインだけでなく、自分のコンピューター(localhost)でも機能します。