href 属性、link タグ、base タグと混同されることがよくあります。ファイルをサブフォルダーに移動しても機能するように CSS ファイルを適切にリンクする方法がわからないので (例は後述)、場所を指定するときに href がどのように機能するかを調べました。
ご存じのとおり、私はローカルホストで作業しているため、メインhtdocs
フォルダーがあり、その中に複数のフォルダーがあり、それぞれが取り組んでいるプロジェクトに対応しています。最終的には次のようになります。
localhost/index.php (which redirects to localhost/home/index.php)
localhost/home/
localhost/zune/
localhost/school/
localhost/aeac/
一般的に、フォルダのレイアウトは次のようなものになります。
localhost/aeac/images/
localhost/aeac/stylesheets/
localhost/aeac/scripts/
続けて、ファイルがlocalhost/aeac/test/index.html
あり、その中にテスト用の 4 つのリンクがあるとします。私はそれを発見しました
<a href="/"> will link to "localhost/"
<a href="./"> will link to "localhost/aeac/test/" (the directory the file is in.)
<a href="../"> will link to "localhost/aeac/" (the directory above the file.)
<a href="about.html">will link to "localhost/aeac/test/about.html" (the directory the file is in.)
href を理解したところで、CSS を適切にリンクする方法を理解する必要があります。
サイトのディレクトリが次のようになっていると想像してください。
localhost/aeac/
localhost/aeac/images/
localhost/aeac/stylesheets/
localhost/aeac/scripts/
そして、/aeac/
私が持っているフォルダにありますindex.html
。ファイルには、次のようなリンク タグがあります。
<link rel="stylesheet" href="stylesheets/main.css" />
main は基本的にサイトの構造/テーマであり、すべてのファイルに含まれます。サブフォルダーを作成する必要があるときに問題が発生します。ができましたlocalhost/aeac/users/*username*/index.html
。stylesheets
サイトはまだ main.css を使用していますが、そこにフォルダーがないため、リンクは機能しません。
問題を解決するためにベースタグを使用する必要があると思いますが、それがどのように記述されるかについてはまだ混乱しています。また、users フォルダー内のすべてのファイルのリンク タグを変更するだけでよいことはわかっていますが、この方法でそれを行う方法を知りたいです (それが可能であれば)。