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 文件中，您没有正确给出图像路径。（你应该从你的 CSS 文件而不是 html 中给出一个相对路径）
  2. 在您的新 CSS 文件中，body{}标签被覆盖为空。

解决方法：尝试通过将 配置background-color为某种颜色来检查 CSS 并对其进行测试。因此，您可以通过这种方式确保 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 回答