Question

我目前正在开发一款redmine应用。我希望页面具有响应性，但它确实不起作用，尽管我已经包含了元标记。

Redmine标题/横幅未显示在页面上，但我注意到代码仍然存在。也许这就是问题？如果是这样，我该如何完全删除此页面的代码？

这是页面的代码：

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<title>Redmine</title>
<meta name="description" content="Redmine" />
<meta name="keywords" content="issue,bug,tracker" />
<meta content="authenticity_token" name="csrf-param" />
<meta content="zAhdWOwD3KiOanSXnXiNPIT0NzBRFQwbsH1y4wkiqww=" name="csrf-token" />
<link rel='shortcut icon' href='/favicon.ico?1459352855' />
<link href="/stylesheets/jquery/jquery-ui-1.11.0.css?1459352855" media="all" rel="stylesheet" type="text/css" />
<link href="/stylesheets/application.css?1459352855" media="all" rel="stylesheet" type="text/css" />

<script src="/javascripts/jquery-1.11.1-ui-1.11.0-ujs-3.1.3.js?1459352855" type="text/javascript"></script>
<script src="/javascripts/application.js?1459352855" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
$(window).load(function(){ warnLeavingUnsaved('Die aktuellen Änderungen gehen verloren, wenn Sie diese Seite verlassen.'); });
//]]>
</script>


<!-- page specific tags -->

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <link href="/plugin_assets/redmine_mtr/stylesheets/styles.css?1459353025" media="screen" rel="stylesheet" type="text/css" />
    <meta name="viewport" content="width=20, initial-scale=1">

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" type="text/javascript"></script>


</head>
<body class="controller-mtr_account action-mtr_login">
<div id="wrapper">
<div id="wrapper2">
<div id="wrapper3">
<div id="top-menu">
    <div id="account">
        <ul><li><a href="/login" class="login">Anmelden</a></li>
<li><a href="/account/register" class="register">Registrieren</a></li></ul>    </div>

    <ul><li><a href="/" class="home">Hauptseite</a></li>
<li><a href="/projects" class="projects">Projekte</a></li>
<li><a href="http://www.redmine.org/guide" class="help">Hilfe</a></li></ul></div>

<div id="header">
    <div id="quick-search">
        <form accept-charset="UTF-8" action="/search" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>

        <label for='q'>
          <a href="/search" accesskey="4">Suche</a>:
        </label>
        <input accesskey="f" class="small" id="q" name="q" size="20" type="text" />
</form>        
    </div>

    <h1>Redmine</h1>

</div>

<div id="main" class="nosidebar">
    <div id="sidebar">


    </div>

    <div id="content">

        <div id="login-form" class="col-sm-12 modal show" tabindex="-1" role="dialog" aria-hidden="true">
    <form accept-charset="UTF-8" action="/mtr/login" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="zAhdWOwD3KiOanSXnXiNPIT0NzBRFQwbsH1y4wkiqww=" /></div>

        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="container col-md-12">Login</h1>
                    <h5 class="container col-md-12">Mobile Time Recording</h5>
                </div>
                <div class="modal-body form-group">
                    <div style="padding-top: 5px;">
                        <input class="login-input" id="username" name="username" style="width: 100%" tabindex="1" type="text" />
                    </div>
                    <div style="padding-top: 5px;">
                        <input class="login-input" id="password" name="password" style="width: 100%" tabindex="2" type="password" />
                    </div>
                    <div style="padding-top: 5px;">
                        <input type="submit" style="height: 38px" class="form-control input-lg btn btn-danger"
                               name="loginMtr" value="Anmelden &#187;" tabindex="5"/>
                    </div>
              </div>
          </div>
        </div>
</form></div>

    <script type="text/javascript">
//<![CDATA[
$('#username').focus();
//]]>
</script>


        <div style="clear:both;"></div>
    </div>
</div>
</div>

<div id="ajax-indicator" style="display:none;"><span>Lade...</span></div>
<div id="ajax-modal" style="display:none;"></div>

<div id="footer">
  <div class="bgl"><div class="bgr">
    Powered by <a href="http://www.redmine.org/">Redmine</a> &copy; 2006-2015 Jean-Philippe Lang
  </div></div>
</div>
</div>
</div>

</body>
</html>

Answer 1

我首先建议您使用bootstrap和jQuery CDN而不是文件。这样做的原因是为了帮助您的资产管道以及将来证明您的代码 - 例如......如果您的jQuery lib已过期 - 您将不得不手动返回并更新它。而不是仅仅附加CDN而忘记它。

第二个最佳做法是始终在结束</body>标记之前将所有JavaScript src标记移动到页面末尾。

此外，如果您可以使用您遇到的错误更新问题 - 这可能会更有帮助。最好的做法是在制作网站时保持开放式工具的开放性（有助于查看您在DOM上遇到的错误）。

网页没有响应，尽管有带meta标签的引导程序（Redmine）

1 个答案: