```csharp
// shared/_layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
</head>
<body>
<ul>
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("Opera List", "Index", "Opera")</li>
</ul>
<div>
@RenderBody()
</div>
</body>
</html>
//==============================
// shared/_layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
<link href="~/Content/site.css" rel="stylesheet" />
</head>
<body>
<ul>
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("Opera List", "Index", "Opera")</li>
<li>@Html.ActionLink("Opera Create", "Create", "Opera")</li>
</ul>
<div>
@RenderBody()
</div>
<script src="~/Scripts/jquery-3.7.1.js"></script>
</body>
</html>
//================================
// basic.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<meta name="viewport" content="width=device-width" />
<link href="Content/bootstrap.css" rel="stylesheet" />
</head>
<body>
<div class="container">
<h1>Basic</h1>
<a href="/" class="btn btn-primary">MVC</a>
</div>
<script src="Scripts/jquery-3.7.1.js"></script>
<script src="Scripts/bootstrap.js"></script>
</body>
</html>
//=======================
// grid.html
<div class="container">
<div class="row">
<!--.col-md-1{col$$}*12-->
<div class="col-md-1">col01</div>
<div class="col-md-1">col02</div>
<div class="col-md-1">col03</div>
<div class="col-md-1">col04</div>
<div class="col-md-1">col05</div>
<div class="col-md-1">col06</div>
<div class="col-md-1">col07</div>
<div class="col-md-1">col08</div>
<div class="col-md-1">col09</div>
<div class="col-md-1">col10</div>
<div class="col-md-1">col11</div>
<div class="col-md-1">col12</div>
</div>
</div>
//===================================
<div class="row">
<div class="col-sm-4">
Tincidunt integer eu augue augue nunc elit dolor, luctus placerat scelerisque euismod, iaculis eu lacus nunc mi elit, vehicula ut laoreet ac, aliquam sit amet justo nunc tempor, metus vel.
</div>
<div class="col-sm-4">
Tincidunt integer eu augue augue nunc elit dolor, luctus placerat scelerisque euismod, iaculis eu lacus nunc mi elit, vehicula ut laoreet ac, aliquam sit amet justo nunc tempor, metus vel.
</div>
<div class="col-sm-4">
Tincidunt integer eu augue augue nunc elit dolor, luctus placerat scelerisque euismod, iaculis eu lacus nunc mi elit, vehicula ut laoreet ac, aliquam sit amet justo nunc tempor, metus vel.
</div>
</div>
//==============
// form.html
<form class="form-inline">
<div class="form-group">
<label for="email"> Email </label>
<input class="form-control" type="email" id="email" />
</div>
<div class="form-group">
<label for="password"> Password </label>
<input class="form-control" type="password" id="password" />
</div>
<input type="submit" class="btn btn-primary" />
</form>
//=============================
// button.html
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-link">Link</button>
//================================
// navbar
<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="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="https://www.uuu.com.tw"> UCOM </a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
//======================
// opera/index.cshtml
<table class="table table-striped">
<thead>
<tr>
<th>@Html.DisplayNameFor(m => m.Title)</th>
<th>@Html.DisplayNameFor(m => m.Year)</th>
<th>@Html.DisplayNameFor(m => m.Composer)</th>
<th></th>
</tr>
</thead>
// site.css
thead{
background-color:black;
color:white;
}
//=====================
// opera/index.cshtml
@using (Html.BeginForm("filterdata", "opera", FormMethod.Get, new {@class="form-inline"}))
{
@:Number: @Html.TextBox("number",null,new {@class="form-control" })
<input type="submit" class="btn btn-primary"/>
}
//======================================
<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="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("MyWeb", "Index", "Home",null,new {@class="navbar-brand"})
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Opera List", "Index", "Opera")</li>
<li>@Html.ActionLink("Opera Create", "Create", "Opera")</li>
</ul>
</div>
</div>
</div>
//========================
// shared/_layout.cshtml
<script src="~/Scripts/jquery-3.7.1.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
@RenderSection("scripts",false)
// operas/create.cshtml
@section scripts{
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
}
```
Sign in with Wallet
Connect another wallet