视图中的更改导致聚合物样式问题
Changes in View causes polymer style issues
所以我想用聚合物来制作一个时尚的mvc网页。我不喜欢从头开始,因为在 asp mvc 方面我仍然有点菜鸟,所以我从 Visual Studios asp mvc 模板开始。我所做的唯一更改是删除了对 _Layout.cshtml 上的训练营和导航菜单的引用,并添加了一个核心工具栏(+ 一些其他小的 html 更改)。一开始效果很好,但在我对索引文件进行更改后,所有聚合物样式都丢失了。
这是我的 _layout.cshtm:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>
@*@Styles.Render("~/Content/ArmistanceMaterial.css?"+Guid.NewGuid())*@
<link rel="import" href="bower_components/core-toolbar/core-toolbar.html?@Guid.NewGuid()">
<link rel="import" href="bower_components/font-roboto/roboto.html?@Guid.NewGuid()">
<link rel="stylesheet" href="Content/ArmistanceMaterial.css?@Guid.NewGuid()">
<title>Armistance</title>
</head>
<body>
<core-toolbar>
<img src="~/Content/Images/Armistance.png" height="50%" style="padding-right:15px;" />
<span flex>Armistance</span>
</core-toolbar>
<section>
@RenderBody()
</section>
<section>
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</section>
@*@Scripts.Render("~/bundles/webcomponents")*@
</body>
</html>
这是我的 Index.cshtml:
@{
ViewBag.Title = "Home Page";
}
<div>
<h1>ASP.NET</h1>
<p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
<p><a href="http://asp.net">Learn more »</a></p>
</div>
<div >
<div >
<h2>Getting started</h2>
<p>
ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
enables a clean separation of concerns and gives you full control over markup
for enjoyable, agile development.
</p>
<p><a href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more »</a></p>
</div>
<div >
<h2>Get more libraries</h2>
<p>NuGet is a free Viual Studio extension that makes it easy to add, remove, and update libraries and tools in Visual Studio projects.</p>
<p><a href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more »</a></p>
</div>
</div>
一切似乎都运行良好:
直到我执行删除或添加 div(在本例中为添加)之类的操作。
我认为这是因为我没有使用相对于根目录的路径,而是相对于当前视图目录的路径。我认为这很奇怪,因为我认为刷新页面不会更改活动目录。
修复:将“~/”添加到路径的开头
仅供参考:我在发布后不久就想通了,只是想澄清一下这个愚蠢的错误并没有花我一个星期的时间来弄清楚。
所以我想用聚合物来制作一个时尚的mvc网页。我不喜欢从头开始,因为在 asp mvc 方面我仍然有点菜鸟,所以我从 Visual Studios asp mvc 模板开始。我所做的唯一更改是删除了对 _Layout.cshtml 上的训练营和导航菜单的引用,并添加了一个核心工具栏(+ 一些其他小的 html 更改)。一开始效果很好,但在我对索引文件进行更改后,所有聚合物样式都丢失了。
这是我的 _layout.cshtm:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>
@*@Styles.Render("~/Content/ArmistanceMaterial.css?"+Guid.NewGuid())*@
<link rel="import" href="bower_components/core-toolbar/core-toolbar.html?@Guid.NewGuid()">
<link rel="import" href="bower_components/font-roboto/roboto.html?@Guid.NewGuid()">
<link rel="stylesheet" href="Content/ArmistanceMaterial.css?@Guid.NewGuid()">
<title>Armistance</title>
</head>
<body>
<core-toolbar>
<img src="~/Content/Images/Armistance.png" height="50%" style="padding-right:15px;" />
<span flex>Armistance</span>
</core-toolbar>
<section>
@RenderBody()
</section>
<section>
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</section>
@*@Scripts.Render("~/bundles/webcomponents")*@
</body>
</html>
这是我的 Index.cshtml:
@{
ViewBag.Title = "Home Page";
}
<div>
<h1>ASP.NET</h1>
<p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
<p><a href="http://asp.net">Learn more »</a></p>
</div>
<div >
<div >
<h2>Getting started</h2>
<p>
ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
enables a clean separation of concerns and gives you full control over markup
for enjoyable, agile development.
</p>
<p><a href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more »</a></p>
</div>
<div >
<h2>Get more libraries</h2>
<p>NuGet is a free Viual Studio extension that makes it easy to add, remove, and update libraries and tools in Visual Studio projects.</p>
<p><a href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more »</a></p>
</div>
</div>
一切似乎都运行良好:
我认为这是因为我没有使用相对于根目录的路径,而是相对于当前视图目录的路径。我认为这很奇怪,因为我认为刷新页面不会更改活动目录。
修复:将“~/”添加到路径的开头
仅供参考:我在发布后不久就想通了,只是想澄清一下这个愚蠢的错误并没有花我一个星期的时间来弄清楚。