爲什麼我的Datepicker看起來很骯髒？

我正在嘗試使用jQuery UI。我下載的一切，並按照指示，我在HTML中添加這樣的代碼：爲什麼我的Datepicker看起來很骯髒？

<link type="text/css" href="/css/ui-lightness/jquery-ui-1.8.20.custom.css" rel="stylesheet" /> 
<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script> 
<script type="text/javascript" src="/js/jquery-ui-1.8.20.custom.min.js"></script> 
<script type="text/javascript"> 
    $(function() { 
     $("#id_myDate").datepicker({ 
      inline: true 
     }); 
    }); 
</script> 
..... 
<div>Date: <input type="text" id="id_myDate" name="deadLine"></div>

當我打開這個頁面中，日期選擇器看起來很weired。

enter image description here

有什麼不對？當我下載jQuery UI時，我打開index.html並且一切正常（包括datepicker），但是當我將它放入我的應用程序時，它看起來很糟糕。

順便說一句。我的瀏覽器是Chrome瀏覽器（我也在Firefox中測試過，同樣的問題），我正在使用python的google appengine應用程序。

謝謝。

------------------------ EDIT ------------------- --------

對不起。因爲這是一個谷歌appengine，所以我應該配置我的靜態文件，如js和css。我忘了在app.yaml中配置我的css文件。現在，我將它添加到yaml文件中：

- url: /js 
static_dir: js 

- url: /css 
static_dir: css

js和css是這些文件所在的目錄的名稱。非常感謝。

來源

2012-05-12 hakunami

是您的瀏覽器正確加載CSS文件的頭部？在Chrome中按F12，單擊網絡選項卡，然後重新加載頁面以查看加載文件是否有錯誤。 –

您是否嘗試使用控制檯檢查鉻上的錯誤。只需按** F12 **，可能你錯過了什麼 –

@KyleTrauberman你是對的。該CSS沒有加載，因爲在谷歌appengine，我需要配置我的CSS索引文件的目錄。我錯過了這一步。謝謝。 – hakunami

聽起來像是css文件加載不正確。檢查以確保其正確加載。

在Chrome中，您可以按F12來打開開發人員工具。點擊網絡標籤，然後刷新頁面。您將看到發送到Web服務器的每個請求的列表，包括任何錯誤。確保你的css文件加載正確。

來源

2012-05-12 05:08:02

F12真的很方便。問題已經解決了。我編輯這個問題的解決方案。謝謝你:) – hakunami

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

將此代碼添加到您的HTML

來源

2016-01-06 11:31:45 WAYSER

這修復了我。謝謝你，先生。 – SirYancy

歡迎@SirYancy – Phares

爲什麼我的Datepicker看起來很骯髒？

回答

相關問題