▲▲HTML絶対パス相対パスの質問▲▲

質問

http://www.7key.jp/hp/2/8.html
ココで読んでも、僕のやろうとしているリンクの張り方がわからなかったために・・・。
スレッド立てました☆

とりあえず、図を描くので見てください♪

レンタルHPのフォルダー内容(htdocs)
「DIONのレンタルHPを使っています。」

Htdocs(フォルダー)━━━━━━┓
　　　　　　　　　　　　　　　┃　FFFTPで自分の借りてきた場所にアクセスすると
　index.html(top)　　　　 ┃　まず、[cgi-data]と[htdocs]が出てくるのですが、
　　　　　　　　　　　　　┃　このhtdocsの中をあらわしたのが←の図です。
　1(フォルダー)　　　　　　　 ┃　まず[htdocs]にはtopページとなる「index.html」
　　　┗a.html　　　　　　┃　[1]というフォルダーと[2]というフォルダー
　　　　　　　　　　　　　┃　があります、[1][2]のフォルダーにはそれぞれ
　2(フォルダー)　　　　　　　 ┃　htmlファイルが一つずつ入っています。
　　　┗b.html　　　　　　┃　indexから[1]の中にある[a.html]へのリンクの
　　　　　　　　　　　　　┃　張り方は「./1/a.html」とわかったのですが。
━━━━━━━━━━━━━┛　[1]の中にある[a.html]から[2]の中にある
　　　　　　　　　　　　　　　[b.html]へのリンクの仕方がわかりません。
　　　　　　　　　　　　　　　同じように、逆もわかりません・・・。
　　　　　　　　　　　　　　　一度[1]のフォルダーから出るので[../]になって
　　　　　　　　　　　　　　　その中の[2]に行って、b.htmlに張りたいので
　　　　　　　　　　　　　　　[.././2/a.html]になるのでしょうか？

回答No.1

Chronos198 · ベストアンサー

図がだいぶずれてしまってますね・・・。
htdocs
┣index.html
┣1(フォルダ)
┃　┗a.html
┗2(フォルダ)
　　┗b.html

といった感じでしょうか。(ズレたらすみません。)

結論から言えば[.././2/b.html]でも行けるかもしれません。
ですが、[./]というのは[現在のフォルダ]という意味ですので、
[./]が何の意味もない状態です。
よって、[../2/b.html]の方がより正しい記述ではないかと思います。

回答No.4

koutarou504

a.html から b.html へ
．．／２／ｂ．ｈｔｍｌ

b.html から a.html へ
．．／１／ａ．ｈｔｍｌ

仮に [1]の中に[c.html] があり
a.html から c.html へ
．／ｃ．ｈｔｍｌ　または　．．／１／ｃ．ｈｔｍｌ

となります。

で、意味ですが、
．／　（ピリオド１つにスラッシュ１つ）
は、そこ（基準となっている場所）と同じ場所を意味します。
「./1/a.html」は判ったとある様に
これは、htdocs にある index.html での記述との事で
「htdocs にある 1 にある a.html」となります。

次に
．．／　（ピリオド２つにスラッシュ１つ）
は、そこ（基準となっている場所）を含むひとつ上のフォルダというか階層を指し示します。
．．／．．／　となれば２つ上のフォルダ（階層）となります。
あとは ．／ の時と同様にそこからフォルダ名，ファイル名と続きます。

尚、特定の状況によってはその基準となる場所が違う事もあるので（HTML の BASE 要素で意図的に変えられたり、外部ファイルを使った場合の評価のタイミングの違いなど）あくまで基準からの相対指定であると、ご注意下さい。（現在地を省略した絶対指定ではありません。）

回答No.3

bavarois

[1]の中にある[a.html]から[2]の中にある[b.html]へは「../2/b.html」、
[2]の中にある[b.html]から[1]の中にある[a.html]へは「../1/a.html」です。

上のでできなかったら、http://～フルパスで書いたら簡単にできると思います。

回答No.2

noname#29456

htdocs/1/a.htmlからhtdocs/2/b.htmlにリンクを張る場合は、
<a href="../2/b.html">
でOKです。
逆も同様。

念のため、
htdocs/index.htmlからhtdocs/1/a.htmlにリンクを張る場合は、
<a href="1/a.html">
htdocs/1/a.htmlからhtdocs/index.htmlにリンクを張る場合は、
<a href="../index.html">

ここらへんのことは、ちょっと
やればすぐ感覚的に理解できるはずです。