2.4　为什么这样做是无懈可击的

我们刚刚从一个高质量的网站中选择了一个设计精美的选项卡式导航栏为例，对其进行剖析，用更精简的代码对其进行重构，使之更容易升级。对于不同种类的浏览 器、浏览设备、辅助软件都有更佳的亲和力。更值得称道的是它的灵活性，无论选 项卡里面的文字大小和内容量是多少，它都能够适应。

由于我们巧妙地设置了背景图片和颜色，整组选项卡都是可伸缩的。如果浏览者 想通过放大文字以增加可读性，那么整个的设计样式也会随之而调整(图 2-14)。

图 2-1 4　选项卡的设计样式可随着调整浏览器显示的文字大小而放大或缩小

几分钟之内，我们就可以改变导航文字、增加或删除选项卡，作即时的更新。通过简单地编辑一下构成导航栏的无序列表便可以实现。惟一需要改变的就是列表项中的 文字。见图 2 - 1 5 。

<ul id="nav">

<li id="t-intro"><a href="/">Home</a></li>

<li id="t-about"><a href="about.html">Why Lance Rules</

a></li>

<li id="t-news"><a href="news.html">The Latest News</a></

li>

<li id="t-sponsors"><a href="sponsors.html">People Who

Like Lance</a></li>

</ul>

图 2 -1 5 　通过更新可读性极好的无序列表，仅仅需要几秒钟，便可改变每个选项卡上的文字