web-dev-qa-db-ja.com

同じまたは異なるフォルダー内のhtmlページをリンクする方法は?

フルパスを記述せずに同じまたは異なるフォルダにあるHTMLページにリンクするにはどうすればよいですか?

35
user112341

同じフォルダー内で、ファイル名を使用するだけです:

<a href="thefile.html">my link</a>

親フォルダーのディレクトリ内:

<a href="../thefile.html">my link</a>

サブディレクトリ内:

<a href="subdir/thefile.html">my link</a>
58
AgileJon

また、これはディレクトリを上に移動してから、別のサブフォルダに戻ります。

<a href = "../subfolder/page.html">link</a>

複数のディレクトリに移動するには、これを実行できます。

<a href = "../../page.html">link</a>

ルートに移動するには、これを使用します

<a href = "~/page.html">link</a>
13
swagers

また、ルートディレクトリを参照する場合は、次を使用できます。

/

ルートを参照します。したがって、いくつかのレベルのフォルダー内にネストされたファイルにあり、メインのindex.htmlに戻りたいとします。

<a href="/index.html">My Index Page</a>

ロバートは、相対的なパスの詳細な説明を提供しています。

12
joeylange

次を使用して、階層内のフォルダーに移動できます

../

したがって、/ webroot/site/pages/folder1/myotherpage.htmから/webroot/site/pages/folder2/mypage.htmフォルダーに移動するには、リンクは次のようになります。

<a href="../folder2/mypage.htm">Link to My Page</a>
9
Robert Harvey

相対パスを使用する

メインページは次のようになります。/ index.html

セカンダリページ:/ otherFolder/otherpage.html

リンクは次のようになります:

<a href="/otherFolder/otherpage.html">otherpage</a>
7
Chris Ballance

ルートディレクトリにリンクする場合は、使用できます

/、 または /index.html

同じディレクトリ内のファイルにリンクする場合は、ファイル名を入力してください

<a href="/employees.html">Employees Click Here</a>

フォルダを戻すには、次を使用できます

../

ルートディレクトリから従業員ディレクトリのインデックスページにリンクするには、次のようにします。

<a href="../employees/index.html">Employees Directory Index Page</a>
6
than10

絶対パスを使用している場合、アプリケーションをサーバーの「サブディレクトリ」にインストールすることはできません。

たとえば、 http://yourserver.com/yourapp は機能しますが、 http://myserver.com/apps/yourapp は機能しません!

4
jrharshath

つかいます

../

たとえば、ファイルの場合、画像がfolder1 in folder2この方法で見つける

../folder1/folder2/image
2
Syntaxsizer

簡潔な答え:

は現在のディレクトリ用です

..は、シェルのcd ..コマンドのように、上位ディレクトリ用です。

シンプルでありながらトリッキーな、私は主に次回を忘れないようにこの答えを書いています。

ademSite/
├── index.html
└── style.css

index.html[〜#〜] css [〜#〜]へのリンク:

<link rel="stylesheet" href="style.css">または<link rel="stylesheet" href="./style.css">

ademSite/
├── index.html
└── stylefiles
    └── style.css

この場合、次のようになります。

<link rel="stylesheet" href="stylefiles/style.css">または<link rel="stylesheet" href="./stylefiles/style.css">

├── html
│   └── index.html
└── stylefiles
    └── style.css

この場合、パスmust be:<link rel="stylesheet" href="../stylefiles/style.css">

1
adem

ASP.NETの場合、これは開発と展開に役立ちました。

<a runat="server" href="~/Subfolder/TargetPage">TargetPage</a>

runat="server"href="~/"を使用することが、ルートに移動するためのキーです。

0
Harry