下面写的是登陆系统之后的界面了,这是项目核心之一的界面了,与之前适用于很多系统的登陆界面不同的是,接下来这些界面只适用于我们自己的系统,使系统独一无二的。
这个界面是用户登录后所能看到的系统中的题目列表信息的界面,标题栏有题目、讨论区等选项,主界面的列表中包含了题目的序号,名称,难度,是否提交是否通过等信息,是对题目及完成情况的一个信息展示。如下图当点击序号后会立即转到题目的阐述及答题编码界面。
<!DOCTYPE <html>
<head>
<meta charset="utf-8">
<link rel= "stylesheet" href = "css/oj.css">
<link rel= "stylesheet" href = "css/bootstrap.css">
<link rel= "stylesheet" href = "css/bootstrap.min.css">
<link rel= "stylesheet" href = "css/bootstrap.theme.css">
<link rel= "stylesheet" href = "css/bootstrap.theme.min.css">
<title> 题目</title>
</head>
<body>
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<ul class="nav navbar-nav navbar-left">
<li><a href="/">首页</a></li>
<li><a href="/">题目</a></li>
<li><a href="/">讨论区</a></li>
</ul>
<nav>
<ul class="nav navbar-nav navbar-right">
<li><a href="/">登出</a></li>
</ul>
</nav>
</div>
</header>
<div class="container-fluid">
<div class="row">
<div class="col-md-8 col-md-offset-2 main">
<h2 class="sub-header">题目列表</h2>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>序号</th>
<th>题目名称</th>
<th>难度</th>
<th>是否提交</th>
<th>是否通过</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/">1</a></td>
<td>两数相加</td>
<td>简单</td>
<td>是</td>
<td>否</td>
</tr>
<td><a href="/"></a></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tbody>
</table>
</div>
<ul class="pagination">
<li class="active"><a href="/">1</a></li>
<li><a href="/">2</a></li>
<li><a href="/">3</a></li>
<li><a href="/">4</a></li>
<li><a href="/">5</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>