我试图在Asp.net中使用Bootstrap,但是布局无法正常工作。请帮助我为什么我的布局不起作用。我不知道我把每个CSS和HTML都放了。我的导航栏看起来还可以,但无法正常工作。 ................................................... ................................................... ................................................... ................................................... ................................................... ................................................... ................................................... ...............................................
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@*@Styles.Render("~/Content/css")*@
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-
awesome.min.css" />
<link href="~/Content/MyMainLayOut.css" rel="stylesheet" />
<link href="~/Content/modern-business.css" rel="stylesheet" />
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="container">
<nav class="navbar fixed-top navbar-expand-lg fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Start Bootstrap</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-
toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Portfolio
</a>
<div class="dropdown-menu dropdown-menu-right" aria-
labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">1 Column
Portfolio</a>
<a class="dropdown-item" href="portfolio-2-col.html">2 Column
Portfolio</a>
<a class="dropdown-item" href="portfolio-3-col.html">3 Column
Portfolio</a>
<a class="dropdown-item" href="portfolio-4-col.html">4 Column
Portfolio</a>
<a class="dropdown-item" href="portfolio-item.html">Single Portfolio
Item</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Blog
</a>
<div class="dropdown-menu dropdown-menu-right" aria-
labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Blog Home 1</a>
<a class="dropdown-item" href="blog-home-2.html">Blog Home 2</a>
<a class="dropdown-item" href="blog-post.html">Blog Post</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPages" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Other Pages
</a>
<div class="dropdown-menu dropdown-menu-right" aria-
labelledby="navbarDropdownPages">
<a class="dropdown-item" href="full-width.html">Full Width Page</a>
<a class="dropdown-item" href="sidebar.html">Sidebar Page</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">404</a>
<a class="dropdown-item" href="pricing.html">Pricing Table</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
</div>
答案 0 :(得分:0)
您似乎已将此行注释掉了。
@*@Styles.Render("~/Content/css")*@
如果您尚未移动任何文件或未将其重命名,并且已在应用程序中安装了引导程序,则该行代码应加载您的引导程序文件。您可以检查/App_Start/BundleConfig.cs来查看取消注释后将加载哪些文件。
我也不知道这些文件包含什么,但是它们可能有一些冲突的CSS。
<link href="~/Content/MyMainLayOut.css" rel="stylesheet" />
<link href="~/Content/modern-business.css" rel="stylesheet" />
答案 1 :(得分:0)
<body>
和<html>
在U're code中没有结束标记。
<!DOCTYPE html>
<html>
<head>
.
.
</head>
<body>
**** U're HTML goes here ****
**</body>
</html>**