0

middleman-blog 拡張機能を使用して、Middleman でブログを作成し始めています。ホームページでは、これまでのところすべてがうまく機能しています。リンクをクリックして完全なブログ投稿を表示すると、問題が発生します。完全なブログ投稿ページには CSS が適用されていません。さらに調べたところ、404 エラーが発生しました。次のように、CSS リンクの href で 3 レベル上に移動して、Dev Tools で修正しました。

BEFORE (ホームページでは機能しますが、記事ページでは機能しません)

<link rel="stylesheet" href="stylesheets/global.sass">

AFTER (2 レベル上に移動しても 404 は返されなくなりました)

<link rel="stylesheet" href="../../../stylesheets/global.sass">

私の質問は次のとおりです。ホームページはそのままで、アーティクル ページが CSS 3 レベルを検索できるようにするには、何を変更する必要がありますか?

4

1 に答える 1

1

あなたの場合、最も簡単な方法は webroot 相対パスを使用することです。

要約すると、通常の相対パスを使用しています...

<link rel="stylesheet" href="stylesheets/global.sass">

ページが にhttp://example.com/index.htmlある場合、ブラウザは を探しますhttp://example.com/stylesheets/global.sass。

しかし、あなたのページが にあるhttp://example.com/blogs/2013/03/20/blogpost.html場合、ブラウザはhttp://example.com/blogs/2013/03/20/stylesheets/global.sass

さて、解決策は...

パスの先頭にスラッシュを追加すると、その相対パスが webroot 相対パスになります。Web ブラウザーは webroot でファイルの検索を開始します...

<link rel="stylesheet" href="/stylesheets/global.sass">

そのため、ページがhttp://example.com/index.html、http://example.com/blogs/2013/03/20/blogpost.htmlまたはのどちらにあるかに関係なくhttp://example.com/a/b/c/d/e/f/g/h/i/j/k/l/m/n/o/p/page.html、ブラウザは常に でファイルを探しますhttp://example.com/stylesheets/global.sass。

リンクとナビゲーションに関するAdob​​e Dreamweaver のドキュメントでは、これについてもう少し詳しく説明しています。

于 2013-03-20T16:29:03.880 に答える