<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>马面的青春部落格</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--为了确保适当的绘制和触屏缩放,需要在 <head> 之中添加 viewport 元数据标签。-->
<link href="CSS/bootstrap.min.css" rel="stylesheet" type="text/css" media="all"> <!--插入bootstarp-->
<link href="CSS/main.css" rel="stylesheet" type="text/css" media="all">
<script type="text/javascript" src="JavaScript/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="JavaScript/bootstrap.min.js"></script><!--引入js文件-->
<script type="text/javascript" src="JavaScript/main.js"></script>
</head>
<body>
<nav class="navbar navbar-default" >
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">马面的青春部落格</a>
</div>
<div class="collapse navbar-collapse " id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="Blog.html">文章</a></li>
<li><a href="Photo.html">相册</a></li>
<li><a href="Person.html">个人简介</a></li>
<li><a href="Contact.html">联系方式</a></li>
<li><img class="navimg" src="image/twitter.png" ></li>
<li><img class="navimg" src="image/Github.png" ></li>
<li><img class="navimg" src="image/gmail.png" ></li>
</ul>
</div>
</nav>
</body>
</html>
&#13;
示例:markmamian.github.io导航栏无法在移动设备上运行。
答案 0 :(得分:0)
来自bootstrap网站的完整响应式导航栏的代码。如果您要从中删除部件,请在每个步骤后刷新以查看您出错的地方。
pdf("myplot3.pdf", width=.51, height=.255)
grid.rect(height=0.95,width=0.95, gp=gpar(col="red"))
dev.off()
答案 1 :(得分:0)