ASP.NET Responsive Design について
今更ですが、ちゃんと知っておこうという事で実践しつつ、
学習を進めていこうと思っています。
学習を始める前に、私の環境は以下の通り。
- Visual Studio 2015 Community
- ASP._NET MVC5
- jQuery version = 1.9.1
- bootstrap version = 3.3.7
試しに、最小の構成で動かしてみる。。。
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> <link rel="stylesheet" href="~/Content/bootstrap.css" /> <script src="~/scripts/jquery-1.9.1.js"></script> <script src="~/scripts/bootstrap.js"></script> </head> <body> <div class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a asp-area="" asp-controller="Default" asp-action="Index" class="navbar-brand">Index</a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li><a asp-area="" asp-controller="Default" asp-action="Test1">テスト1</a></li> <li><a asp-area="" asp-controller="Default" asp-action="Test2">テスト2</a></li> </ul> </div> </div> </div> </body> </html>
一先ず、以下の参照すれば動きそうですね。
<link rel="stylesheet" href="~/Content/bootstrap.css" /> <script src="~/scripts/jquery-1.9.1.js"></script> <script src="~/scripts/bootstrap.js"></script>