2

私が取り組んでいるプロジェクトでは、CSSファイルに次のようにハードコードされたURLがあります。

a.edit
{
    background: url(/TestSite/Images/Edit.png) no-repeat top left;
    display: inline-block;
    width: 16px;
    height: 16px;
    padding:1px;
    margin:1px;
    text-indent: -9999px; /* hides the link text */
}

サイトが本番環境に移行すると、これらのリンクは壊れます。私は解決策を探しているので、サイトが実行されている場所ならどこでも機能します。

これは私が思いついたものであり、それは機能しますが、より良い方法があるかどうか疑問に思っています：

<script>
    $(document).ready(function () {
        $("a.edit").css('background', 'url(' + $("body").data("baseurl") + 'Images/Edit.png) no-repeat top left');
    });
</script>
<body data-baseurl="~/">...</body>
4

4 に答える 4

7

CSSは、スタイルシートが配置されている場所を基準にした相対URLを処理します。それを利用して、JavaScriptでURLを書き直さないでください。

于 2012-05-21T17:05:21.453 に答える
3

本番サーバーと開発サーバーで同じフォルダー構造を使用します。そして、相対パスを使用します

于 2012-05-21T17:04:43.777 に答える
2

あなたが直面している問題が何であるかを本当に理解していない。絶対パスではなく相対パスを使用すると、ホスティングプロバイダーに関係なく問題ありません...

ところで、考慮すべきもう1つのこと-クライアントがJavaScriptをオフにした場合はどうなりますか？;）

于 2012-05-21T17:04:24.387 に答える
1

相対URLはどうですか？

a.edit
{
    background: url(Images/Edit.png) no-repeat top left;
    ...
}
于 2012-05-21T17:04:51.827 に答える