A ha-U scared me, bady!: 为Blogger添加导航栏（二）

在之前的帖子里已经介绍过如何为Blogger添加导航栏，不过今天在老李的飞刀部落又发现了一个添加导航栏的方法。就个人角度将这个方法和我之前介绍过的方法比较一下：

优点：
1.添加起来更加方便：一步就行
2.更美观（演示|那个带有蓝色标签的导航栏）

缺点：
1.后期添加修改链接不方便——必须重新修改代码，没有之前的方法方便明了。
2.要定制导航栏的颜色的话，需要一定网页知识（我网页知识基本为零 T T）
3.有些模板的侧边栏会遮掉导航栏（比如我的演示，解决方法就是减少导航项）

下面来讲解方法（大部分直接复制老李的日志了，稍微修改了下）：

布局---页面元素---添加小工具那里加入一个“HTML/JavaScript”，添加如下代码：

<style type="text/css">
.align-center{ margin:0 auto; /* 居中这个是必须的，，其它的属性非必须 */ width:500px; /* 给个宽度顶到浏览器的两边就看不出居中效果了 */ background:#ffffff; /* 背景色 */ text-align:center; /* 文字等内容居中 */ }

/*导航条，不是最上面那个东西，是下面主页、关于什么那里。*/
#navsite h5 {
display: none;
}
#navsite ul {
padding: 3px 0;
margin-left: 0;
border-bottom: 1px solid #778;
font: bold 12px Verdana, sans-serif;
}
#navsite ul li {
list-style: none;
margin: 0;
display: inline;
}
#navsite ul li a {
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid #778;
border-bottom: none;
background: #DDE;
text-decoration: none;
}
#navsite ul li a:link {
color: #448;
}
#navsite ul li a:visited {
color: #667;
}
#navsite ul li a:link:hover, #navsite ul li a:visited:hover {
color: #000;
background: #AAE;
border-color: #227;
}
#navsite ul li a#current {
background: white;
border-bottom: 1px solid white;
}
</style>

<div id="navsite" class="align-center">
<h5>Site navigation:</h5>
<ul>
<li><a href="http://lukexzt.blogspot.com/">首页</a></li>
<li><a href="http://lukexzt.blogspot.com/search/label/%E8%B5%84%E6%BA%90%E5%85%B1%E4%BA%AB-%E5%85%8D%E8%B4%B9%E7%A9%BA%E9%97%B4">免费空间推荐</a></li>
<li><a href="http://lukexzt.blogspot.com/search/label/Blogger%E6%8A%80%E5%B7%A7">Blogger技巧汇总</a></li>
<li><a href="http://www.blogger.com/home">控制台</a></li>
</ul>
</div>