純bootstrap寫的後臺管理頁面
阿新 • • 發佈:2019-01-11
前一段時間在網上找bootstrap寫的後臺管理系統的模板,可是發現大多都是bootstrap+js寫的,而且太過於複雜,所以就自己動手寫了一個,寫的不好,勿噴
index.html程式碼
<!DOCTYPE HTML> <html> <head> <title>後臺管理</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/bootstrap.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="container"> <div class="row clearfix"> <div class="col-md-12 column"> <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <div class="navbar-header"> <a class="navbar-brand" href="#">後臺管理系統</a> </div> </nav> <br /> <br /> <br /> <div class="row clearfix"> <div class="col-md-12 column" > <div class="col-md-3" style="float: left;margin-left: -10%"> <div class="list-group" style="float: left"> <a target="fname" href="main/index1.html" class="list-group-item"><span class="glyphicon glyphicon-home"></span>頁面一</a><br> <a target="fname" href="main/index2.html" class="list-group-item"><span class="glyphicon glyphicon-file"></span>頁面二</a><br> <a target="fname" href="main/index3.html" class="list-group-item"><span class="glyphicon glyphicon-user"></span>頁面三</a><br> <a target="fname" href="main/index4.html" class="list-group-item"><span class="glyphicon glyphicon-off"></span>頁面四</a><br> </div> </div> <div class="col-md-8 column" style="width:75%;"> <iframe name="fname" frameborder="false" style="background-color: red;margin-left:-20%;" width="145%" height="540px"></iframe> </div> </div> </div> </div> </div> </div> </body> </html>
原始碼地址:bootstrap後臺管理系統模板