我正在创建一个MVC Web应用程序。我在网上下载了一个免费模板,似乎工作正常。主页渲染完美,我创建的另一个页面也是如此。
主页:
我创建了另一个名为game的视图(和控制器)。当我导航到这个页面时,它显示正常以及我希望它显示的方式:
游戏索引视图:
我在'Game'视图文件夹中有两个视图文件,一个名为index,另一个名为NewScore,上面的图像是此文件夹中的索引视图,但是当我导航到使用相同共享视图的NewScore页面时页面以损坏的方式显示,如此处所示....
索引视图和NewScore视图中的代码绝对是完全相同的。以下是两者的代码:
@model DARTPRO.Models.Game
<head>
<link href="Content/css/style.css" rel="stylesheet" type="text/css" media="all" />
</head>
@{
ViewBag.Title = "Begin game!";
}
<hgroup class="title">
<h1>@ViewBag.Title</h1>
</hgroup>
<h1 style="display:inline">Current Score: @ViewBag.myScore</h1>
@using (Html.BeginForm("NewScore", "Game", FormMethod.Post))
{
@Html.Label("Enter a value : ")
@Html.TextBox("ReduceBy")
<input type="submit" value="Go Now" />
}
控制器视图:
public class GameController : Controller
{
private static Game myScore = new Game();
public ActionResult Index()
{
myScore.Set_Score(501);
ViewBag.myScore = myScore.Get_Score();
return View();
}
[HttpPost]
public ActionResult NewScore(string ReduceBy)
{
int RD = Convert.ToInt32(ReduceBy);
myScore.Set_Score(myScore.Get_Score() - RD);
ViewBag.myScore = myScore.Get_Score();
return View();
}
}
最后,也许最重要的是共享视图代码。例如_Layout.cshtml。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="Content/css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href='http://fonts.googleapis.com/css?family=Lato:400,300,600,700,800' rel='stylesheet' type='text/css'>
<script src="Content/js/jquery.min.js"></script>
<!---strat-slider---->
<link rel="stylesheet" type="text/css" href="Content/css/slider.css" />
<script type="text/javascript" src="Content/js/modernizr.custom.28468.js"> </script>
<script type="text/javascript" src="Content/js/jquery.cslider.js"></script>
<script type="text/javascript">
$(function () {
$('#da-slider').cslider({
autoplay: true,
bgincrement: 450
});
});
</script>
<!---//strat-slider---->
<script src="Content/js/jquery.magnific-popup.js" type="text/javascript"></script>
<link href="Content/css/magnific-popup.css" rel="stylesheet" type="text/css">
<script>
$(document).ready(function () {
$('.popup-with-zoom-anim').magnificPopup({
type: 'inline',
fixedContentPos: false,
fixedBgPos: true,
overflowY: 'auto',
closeBtnInside: true,
preloader: false,
midClick: true,
removalDelay: 300,
mainClass: 'my-mfp-zoom-in'
});
});
</script>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="wrap">
<div class="header-top">
<div class="logo">
<a href="index.html"><img src="Content/images/logo.png" alt="" /></a>
</div>
<div class="login"> @Html.Partial("_LoginPartial")</div>
<div class="h_menu4">
<!-- start h_menu4 -->
<a class="toggleMenu" href="#">Menu</a>
<ul class="nav">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="pages.html">Pages</a> </li>
<li><a href="shortcodes.html">Shortcodes</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<script type="text/javascript" src="Content/js/nav.js"></script>
</div><!-- end h_menu4 -->
<div class="clear"></div>
</div><!-- end header_main4 -->
</div>
<div id="Hero">@RenderSection("Slide", required: false)</div>
<div class="main">
<div class="wrap">
<h2 class="m_1">Leaderboard</h2>
<div class="content-top">
@RenderBody()
</div>
</div>
</div>
<div class="footer">
<div class="wrap">
<div class="footer-grid footer-grid1">
<div class="f-logo">
<a href="index.html"><img src="Content/images/f-logo.png" alt=""></a>
</div>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words</p>
</div>
<div class="footer-grid footer-grid2">
<h4>Contact</h4>
<ul>
<li>
<i class="pin"> </i><div class="extra-wrap">
<p>2321 Street name,<br> City name,Country</p>
</div>
</li>
<li>
<i class="phone"> </i><div class="extra-wrap">
<p>+2321 256 652</p>
</div>
</li>
<li>
<i class="mail"> </i><div class="extra-wrap1">
<p>info@comapnay name.com</p>
</div>
</li>
<li>
<i class="earth"> </i><div class="extra-wrap1">
<p>info@comapnay name.com</p>
</div>
</li>
</ul>
</div>
<div class="footer-grid footer-grid3">
<h4>Latest Tweets</h4>
<div class="recent-tweet">
<div class="recent-tweet-icon">
<span> </span>
</div>
<div class="recent-tweet-info">
<p>Ds which don't look even slightly believable. If you are going to use a passage <a href="#"> 3 Hours Ago</a></p>
</div>
<div class="clear"> </div>
</div>
<div class="recent-tweet1">
<div class="recent-tweet-icon">
<span> </span>
</div>
<div class="recent-tweet-info">
<p>Ds which don't look even slightly believable. If you are going to use a passage <a href="#"> 3 Hours Ago</a></p>
</div>
<div class="clear"> </div>
</div>
</div>
<div class="footer-grid footer-grid4">
<h4>News Letter</h4>
<p>Randomised words which don't look even slightly believable. If you are going to use a passage</p>
<form>
<input type="text" value="Email Address" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email Address';}">
<input type="submit" value="">
</form>
</div>
<div class="clear"> </div>
</div>
</div>
<div class="footer-bottom">
<div class="wrap">
<div class="copy">
<p>© 2014 Template by <a href="http://w3layouts.com" target="_blank"> w3layouts</a></p>
</div>
<div class="social">
<ul>
<li class="facebook"><a href="#"><span> </span></a></li>
<li class="linkedin"><a href="#"><span> </span></a></li>
<li class="twitter"><a href="#"><span> </span></a></li>
</ul>
</div>
<div class="clear"></div>
</div>
</div>
@RenderSection("Scripts", required: false)
</body>
这只是它发生的一个页面,它也发生在登录页面上。
编辑:
这是两个页面的页面检查,认为它可能会有所帮助: 工作页面:
页面已损坏:
答案 0 :(得分:0)
查看您的视图,您再次引用了CSS,但_Layout.cshtml是一个采用样式,捆绑等的地方。
<head>
<link href="Content/css/style.css" rel="stylesheet" type="text/css" media="all" />
</head>
从屏幕截图中看,CSS看起来确实会导致问题,因为我想象你没有在Game下面有一个名为Content的文件夹。从视图中删除它应该会有所帮助。
答案 1 :(得分:0)
我通过编辑
来解决这个问题@Styles.Render("~/Content/css")
_Layout.cshtml文件中的。我将此呈现器调用的目录更改为我导入的自定义CSS文件的地址。我不知道为什么风格仍然可以在某些页面上运行而不更改上面的代码片段,但是当我将其更改为:
@Styles.Render("~/Content/css/style.css")
没有更多的页面显示腐败。