郑吉鸿，胡静静

(1.淮北职业技术学院 招生办, 安徽 淮北　235000；2.淮北职业技术学院 计算机科学技术系，安徽 淮北　235000)



·综合论坛·

基于CSS和JavaScript的网页选项卡的设计和优化

郑吉鸿1，胡静静2

(1.淮北职业技术学院 招生办, 安徽 淮北235000；2.淮北职业技术学院 计算机科学技术系，安徽 淮北235000)

摘要：JavaScript 是网页设计的核心技术之一，也是网页设计教学的一个重要的模块。很多网站中都利用JavaScript和CSS，实现了选项卡的使用。网页选项卡的设计必须遵循设计原则，然后根据实际需要对其进行优化，可以使页面在有限的空间内展现更多的内容，更便于用户浏览信息，同时可以减少服务器的请求负担。

关键词：CSS；JavaScript；选项卡；网页；HTML

CSS是Cascading Style Sheets(层叠样式表)的简称， JavaScript是一种基于对象的直译式脚本语言，它可以给网页添加动态功能，实现与用户的交互。[1]将CSS与JavaScript相结合，可以制作出很多页面美观且实用性强的网页应用。

选项卡也叫Tab，是一种常用的交互元素，它将不同的内容重叠放置在同一布局区块之中，重叠的内容区里在同一时刻只有其中一层是可见的，实现了小空间，大容量的显示功能，更加符合现代综合网页大信息的布局要求。[2]每个选项卡代表一个活动的区域，用户将鼠标点击或移动到标签上时，会显示该标签对应的内容区内容。使用网页选项卡可以节省页面空间，提高网页空间利用率，并能将有关联的信息分类，便于用户采纳处理。选项卡的实现方法比较多，其实现原理都大致相同。

一、如何设计网页选项卡