Question

我正在使用ASP.NET，我的视图基于我创建的类..但是当我在浏览器上打开视图时，它看起来比平时要小一些..

我的观点：

@model Work.Models.WorkClass

<html>
<head>

<link href="~/theme.css" rel="stylesheet" />
<link href="~/site.css" rel="stylesheet" />
<link href="~/pikaday.css" rel="stylesheet" />
<script src="~/pikaday.js"></script>
</head>
<body>

@using (Html.BeginForm("Report","Home",FormMethod.Post, new { autocomplete= "off" }))
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h2>WorkClass</h2>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.date, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10" id="date">
                @Html.EditorFor(model => model.date, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.date, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.time, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.time, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.time, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.description, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.description, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.description, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<script type="text/javascript">
    var picker = new Pikaday({
        field: document.getElementById('date'),
        firstDay: 0,
        minDate: new Date('2000-01-01'),
        maxDate: new Date('2020-12-31'),
        yearRange: [2000, 2020],
        numberOfMonths: 1
    });
</script>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
</body>
</html>

我注意到当我删除此代码时，视图返回到正确的大小：

<link href="~/theme.css" rel="stylesheet" />
<link href="~/site.css" rel="stylesheet" />
<link href="~/pikaday.css" rel="stylesheet" />
<script src="~/pikaday.js"></script>

有什么问题？

Answer 1

调查后，修复方法是删除链接的样式表site.css。它包含影响页面外观的不良标记。

MVC视图看起来更小

1 个答案: