在ASP.NET项目中使用Twitter的引导 [英] Using Twitter Bootstrap in ASP.NET project
问题描述
我想写我的第一个ASP.NET网站，我真的想使用Twitter的引导，但我的第一道关卡失败。
I am trying to write my first ASP.NET website and I really want to use the Twitter Bootstrap but I'm failing at the first hurdle.
我这里从下载的zip文件，解压缩它并添加文件到我的解决方案，以下行我_layout .cshtml文件：
I downloaded the Zip file from here, unzipped it and added the files to my solution and the following lines to my _LAyout.cshtml file:
<link href="@Url.Content("~/Context/bootstrap.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/bootstrap.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/bootstrap-min.js")" type="text/javascript"></script>
下面是显示我的解决方案上面的文件截图：
Here is a screenshot showing the above files in my solution:
我想创建与从<一个采取这一code在顶部菜单栏href=\"http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/stepping-out-with-bootstrap-from-twitter/\">this turorial
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Context/bootstrap.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/bootstrap.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/bootstrap-min.js")" type="text/javascript"></script>
</head>
<body>
<div class="topbar">
<div class="fill">
<div class="container">
<h3>Present Ideas</h3>
<ul>
<li>Blog</li>
<li>About</li>
<li>Help</li>
</ul>
<ul class="nav secondary-nav">
<li class="menu">
<a href="#" class="menu">Account Settings</a>
<ul class="menu-dropdown">
<li>Login</li>
<li>Register</li>
<li class="divider"></li>
<li>Logout</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="container-fluid">
@RenderBody()
</div>
<footer>
</footer>
</div>
</body>
</html>
我得到的，而不是单杠是这样的：
What I get, instead of the horizontal bar is this:
我想AP preciate让我开始有什么承诺，是任何帮助，一个很好的框架。
I would appreciate any help to get me started with what promises to be, an excellent framework.
推荐答案
您正在使用Twitter的引导2.0，但教程编写了Twitter的引导1.0，一直到标记，你需要使用相当多的变化得到想要的样子。
You're using Twitter Bootstrap 2.0, but the tutorial was written for Twitter Bootstrap 1.0, there has been quite a few changes to the markup you need to use to get the desired look.
这解释了一些在的changelog ，还有它是如何做的，现在一些基本的例子：
It explains some of the changes to the navbar component in the changelog, there are also some basic examples of how it is done now:
http://getbootstrap.com/2.3.2/getting-started。 HTML＃范例
http://getbootstrap.com/2.3.2/components.html#navbar
另外（无关的问题），你其中的两个的缩小的版本和标准版本的CSS / JS，你只需要包括的每个之一。
Also (unrelated to the question), you're including both the minified version and the standard version of the css/js, you only need to include one of each.
这篇关于在ASP.NET项目中使用Twitter的引导的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
