[解決済み] CSSのURLで相対パスと絶対パスを使い分けるには?
2023-03-01 19:28:53
質問
私は本番用と開発用のサーバーを持っています。 問題は、ディレクトリ構造です。
開発用です。
-
http://dev.com/subdir/images/image.jpg
-
http://dev.com/subdir/resources/css/style.css
制作しています。
-
http://live.com/images/image.jpg
-
http://live.com/resources/css/style.css
どうすれば
style.css
で
css
フォルダを作成し、両サーバで同じパスで
background: url
プロパティに同じパスを使用できますか?相対パスで使用できるトリックはありますか?
どのように解決するのですか?
URLは の位置からの相対パスで、CSS ファイル であるため、これでうまくいくはずです。
url('../../images/image.jpg')
相対 URL は 2 つ後ろのフォルダに移動し、さらに
images
フォルダに移動します。構造が同じであれば、両方のケースで動作するはずです。
から https://www.w3.org/TR/CSS1/#url :
部分 URL は、ドキュメントに対する相対的なものではなく、スタイルシートのソースに対する相対的なものとして解釈されます。
関連
-
[CSSチュートリアル】カットコーナー+ボーダー+プロジェクション+コンテンツ背景色のグラデーション効果を実現するCSS
-
[CSSチュートリアル]CSS気まぐれボーダーアニメーション効果
-
[css3]CSS3アニメーションによる光のボタンの流れの効果
-
[ブラウザ互換性チュートリアル]IE9でのネイティブページの互換性問題の解決方法について
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] CSSの三角形はどのように機能するのですか?
-
[解決済み] Pythonでファイルの絶対パスを取得する方法
-
[解決済み] MIME-typeが原因でスタイルシートが読み込まれない
-
[解決済み] 位置は絶対だが、親に対して相対的
-
[解決済み】MVC4 StyleBundleで画像が解決されない件
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[css3]CSS3タブアニメーションの背景切り替えの動的効果例
-
[CSSチュートリアル】検索ボックスの非表示機能を実現するCSS(アニメーションの順送り・逆戻りシーケンス)
-
[CSSチュートリアル]css display table adaptive height, widthの問題解決
-
[css3]css3は、3つの方法のサンプルコードのテキストの点滅効果を達成するために
-
[CSSチュートリアル]CSSは、メソッドのさまざまな記事の分割行のスタイルの要約を達成するために
-
[css3]CSS3のダイヤモンドパズルは、divの背景画像を回転させない機能だけを実現するために
-
[CSSチュートリアル】ネイティブCSSでテキストの無制限回転を実現する汎用的な方法
-
[CSSチュートリアル]CSS気まぐれボーダーアニメーション効果
-
[css3]Apple携帯電話のロック解除のためのCSS3サンプルフォントシャインエフェクト
-
[解決済み] CSSファイルで相対URLを使用していますが、どの位置からの相対位置なのでしょうか?