0

現在、かなり単純なページを使用していますが、何らかの理由で maincss.css が適用されていません。これは単に背景を画像に設定するだけです。jquery スタイリング用の別の css ファイルを追加する前に機能していたため、機能していることはわかっています。これはどう間違っているのでしょうか？

<html xmlns=\ "http://www.w3.org/1999/xhtml\" xml:lang=\"en\">
<head>
  <META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
  <title>Welcome to Jetty-9</title>
  <link href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet">
  <link href="css/maincss.css" rel="stylesheet">
  <script type='text/javascript' src='js/jquery.js'></script>
  <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $( "#dialog" ).dialog({
      width: 400,
      buttons: [
        {
          text: "Ok",
          click: function() {
            $( this ).dialog( "close" );
          }
        },
        {
          text: "Cancel",
          click: function() {
            $( this ).dialog( "close" );
          }
        }
      ]
    });
    });
  </script>
</head>
<body>

  <div id="dialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
  </div>

</body>
</html>
4

2 に答える 2

5

次の理由により、問題に直面する可能性があるようです。

  1. CSS ファイルで、画像パスが正しく指定されていません。(html ではなく、CSS ファイルからの相対パスを指定する必要があります)
  2. 新しい CSS ファイルでは、body{}タグは何も上書きされていません。

解決策: CSS を特定のbackground-color色に設定してテストしてみてください。このようにして、CSS が正常に機能していることを確認し、他のオプションも試すことができます。

于 2013-07-01T19:16:34.567 に答える
0

これを試して

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Script-Type" CONTENT="text/javascript">
  <title>Welcome to Jetty-9</title>
  <link type="text/css" href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet" />
  <link type="text/css" href="css/maincss.css" rel="stylesheet" />
  <script type="text/javascript" src="js/jquery.js"></script>
  <script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $("#dialog").dialog({
      width: 400,
      buttons: [
        {
          text: "Ok",
          click: function() {
            $( this ).dialog( "close" );
          }
        },
        {
          text: "Cancel",
          click: function() {
            $( this ).dialog( "close" );
          }
        }
      ]
    });
    });
  </script>
</head>
<body>

  <div id="dialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
  </div>

</body>
</html>
于 2013-07-01T19:03:11.500 に答える