OJ界面之初始网站页面

最新推荐文章于 2024-08-12 16:47:25 发布

原创最新推荐文章于 2024-08-12 16:47:25 发布 · 1.1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#html

这个博客介绍了如何为在线云评测系统OJ创建一个简单的起始页面。页面包括导航栏，带有主页、问题、帮助、注册和登录的链接，以及一个欢迎消息和注册按钮。HTML结构使用了bootstrap CSS框架来实现布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

众所周知，我们在登陆一个网站或网址后都会有一个最初始的页面（类似门户网站的页面），这个网站有对网站的介绍，该网站的一些咨询等，我们的OJ在线云评测系统当然也要有这么一个网页的存在。很简单很简洁，但还是要有的。

<!DOCTYPE html>
<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">
  </head>

<header class="navbar navbar-fixed-top navbar-inverse">
    <div class="container">
        <ul class="nav navbar-nav navbar-left">
            <li><a href="/">home</a></li>
            <li><a href="/">question</a></li>
        </ul>
        <nav>
          <ul class="nav navbar-nav navbar-right">
            <li><a href="/">Help</a></li>
            <li><a href="/">Signup</a></li>
            <li><a href="/">signin</a></li>
          </ul>
        </nav>
    </div>
</header>


<div class="container">
    <div class="center jumbotron">
        <h1>Welcome to the Sample App</h1>
         <a class="btn btn-lg btn-primary" href="/">Sign up now!</a>
    </div>
</div>
 
<footer class="footer">
    <nav>
        <ul>
            <li><a href="/">About</a></li>
            <li><a href="/">Contact</a></li>
            <li><a href="/">News</a></li>
        </ul>
    </nav>
</footer>

</body>
</html>