2023.05.12HTMLファイルを編集していると、相対パス(呼び出し元のファイルから見た、対象ファイルの位置)の書き方で「./」や「../」といった表現を見たことはないでしょうか?「./」に関しては、あまり見る機会がないかもしれませんが、この2つの表現、意味をしっかりと理解していますでしょうか?今回は、この2つの意味の違いについて解説します。なんとなく使用している方は、ご覧ください。まとめ「./」と「../」の違い「./」も「../」も、相対パスを指定する際に使用する、特殊な表現方法です。「./」に関しては、昔の方で、癖で書いてしまう方がいるようです。違いについて違いを一言で表すのであれば、どの階層を指しているかが違っています。今いるところの1つ上の階層を指す言葉だけだと、イメージが難しいと思いますので、画像付きで解説します。「./」について上記の画像のように、htmlファイルとcssファイルが同じ階層にあるとします。href="./style.css">書くと、こんな感じになります。パターン1も、パターン2も同じです。「./」は今いるところを指すので、書いても書かなくても同じということになります。「../」について上記の画像のように、topフォルダ内にhtmlファイルがあり、cssファイルは、1つ上の階層にあるとします。この時、cssファイルを読み込ませたい場合のバスは、下記のとおりになります。href="../style.css">1つ上の階層に読み込ませたいcssファイルがあるので、「../」を使い、1つ上の階層に上がることで、読み込ませることができます。まとめhtmlの相対パスの書き方で、「./」を使うパターンはあまりないかもしれませんが、見かけたら、今回の記事の内容を思い出していただければと思います。2023.05.13HTML【CSS】hoverとは?サンプル付きで解説!効かない時の対処法も!【もしもアフェリエイト】メリットや登録方法についてご紹介!ホームWEB制作HTMLkazu27歳、法学部出身の現役WEBデザイナーです。資格は、WEBデザイン技能検定3級、ワープロ検定2級、情報処理検定2級を取得しています。旅行が好きで色々な場所に行っています。このブログでは、IT企業の現場で経験した事や勉強した事、解説記事や副業等、ITならではの、ちょっと知ってるだけでも違うアレコレをご紹介しています。【HTML】brタグの使い方のご紹介!改行されない(効かない)場合の対処法もご紹介!サンプル付き!2023.02.192023.05.13【2023年最新】Googleアドセンスの審査に通らない!合格する為のポイントをまとめてみた。2023.01.232023.05.28【悪用】AirTag(エアタグ)に注意!ストーカー、車に設置され住所特定も?対策方法を考えてみた。副業系ホーム検索トップサイドバータイトルとURLをコピーしました。