首頁 > 開發者 > JSP

jsp、css中引入外部資源相對路徑問題分析_JSP編程

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

在jsp頁面中添加base，可用相對路徑：

複製代碼 代碼如下:

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

然後在<head>標籤內添加base

<base href="<%=basePath%>"></base>

　在本頁面中“直接”引入外部檔案時，可直接

複製代碼 代碼如下:

<script src="js/common/jquery-1.11.1.min.js" language="javascript"
    type="text/javascript"></script>
<script src="js/common/frame.js" language="javascript"
    type="text/javascript"></script>
<link href="css/common/frame.css"
    rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />

同理，本頁面中的css類

複製代碼 代碼如下:

.top {
    position: absolute;
    left: 0;
    top: 95px;
    right: 0;
    height: 120px;
    background: url(images/common/title.jpg) repeat-x
}

====================例外情況：引入的外部css、js檔案又引入image等時=================================

這時候如果也用相對路徑的話，因為已經不在了jsp頁面中，此時相對路徑是相對於本css檔案所在的目錄：

如：棠棣新系統，index.jsp頁面中引入的css檔案

<link href="css/common/frame.css" rel="stylesheet" type="text/css" />這時在jsp頁面中，引入的js/common/frame.js是從網站跟目錄開始尋找，沒問題。

但在frame.js中有如下css

複製代碼 代碼如下:

.show_menu{
    background-image: url(images/left_bg.gif);
    background-repeat: repeat-y;
    background-position:285px 51px;
}

這種情況下直接url(images/left_bg.gif);是預設從本css檔案所在目錄（/css/common/frame.css）+url(images/left_bg.gif)，所以此處需要的image需要單獨配置，

改成

複製代碼 代碼如下:

.show_menu{
    background-image: url(../../images/left_bg.gif);
    background-repeat: repeat-y;
    background-position:285px 51px;
}

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

相關關鍵詞：
jsp book jsp 6161 jsp editor jsp quiz jsp language jsp tie free jsp hosting
相關文章
動態網頁製作技術JSP頁面顯示亂碼問題的解決
servlet、jsp跳轉(傳值)總結及URL傳參數__js
Spring Boot 最佳實務（二）整合Jsp與生產環境部署
JSP頁面列印
用JSP實現資料庫圖片的儲存與顯示執行個體
用jsp上傳圖片檔案，存貯到欄位類型為blob的流形式代碼

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

熱門內容

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More