📝

絶対と相対

公開: 2025年07月27日 16時55分
更新: 2025年07月27日 16時58分

WEB開発における「絶対」と「相対」について、「パス指定」と「位置指定」の観点から考えてみましょう。

まずはパス指定です。

パスとは、インターネット上の住所のようなものです。
WEBサイトやアプリなどは様々なファイルによって構成されており、各々住所があるような状態です。
絶対指定でも相対指定でも必要な時にファイルを読み込むことができますが、セキュリティや利便性によって使い分けます。

絶対パスとは、一切の省略無しの住所のようなものです。
県内に配送を依頼するときは市区町村からの宛先で届きますが、県外の場合は都道府県から書かなければなりません。
それが絶対指定に近いです。
インターネット上では「URL」が絶対指定の代表です。
'https://''http://'から始まるURLです。
WEB開発中はサーバーの中においての指定があります。
サーバーの位置の始点のことを「ルートディレクトリ」といいます。
「/」スラッシュ一つだけを書くとそのルートディレクトリを指すことになります。

ホームページURLの例:https://www.example.com

ホームページ内で使われている画像パスの例:https://www.example.com/images/logo.png

サーバー内のHTMLファイルからCSSファイルを読み込む場合の例としてはルート相対パスがよく利用されます。
例:/css/main.css (そのサイトのルート直下にあるCSSディレクトリの中のCSSファイル)
絶対と相対の間のような指定方法です。

相対パスとは、自身から見ての位置です。
自身がファイルAだとしたら、ファイルAからみた場合の他のファイルの位置です。
自身がマンションの1階にいたら5階にいる人を見上げることになりますが、同じ5階に居るとしたらそうならないといった関係性です。
また、親子関係や兄妹関係とも言えます。

例:./image.jpg または image.jpg (自身と同じディレクトリ内にある画像)
例:../css/style.css (1つ上のディレクトリにあるCSSファイル)

次に位置指定についてです。

CSSの’position’から考えてみます。
HTML要素をどこに配置させるかを決めるプロパティです。
‘position: fixed;’は正真正銘の絶対指定で、スクロールやウィンドウサイズを変更しても変わらない位置になりますが、’position: absolute;’は’body’か’position: relative;’が基準となって、そこからの位置指定となります。
つまり、absoluteは基準(親)が変わると自身も影響を受けて変化するので、相対指定に近いです。
使い方によっては絶対指定に近くなることもあるわけです。

絶対指定と相対指定は厳密に定義しようとすると難しいのですが、曖昧なものとして概念をとらえてから柔軟に都度対応していくとよいです。

公開: 2025年07月27日 16時55分
更新: 2025年07月27日 16時58分

コメントや質問をする

メールアドレスが公開されることはありません。