[发明专利]基于CSS展示网页的方法和装置

说明书

技术领域

本发明属于互联网技术领域，尤其涉及一种基于CSS展示网页的方法和装置。

背景技术

随着互联网的迅速发展，各种网站已经非常普及，人们可以在网站上浏览相应的图片或者内容，但是由于每个页面的大小有限，展示的内容就会受到限制。

现有技术中，若想在页面中展示更多的内容，一般采用的是：

1、HTML做布局(超文本标记语言，标准通用标记语言下的一个应用。

“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

超文本标记语言的结构包括“头”部分(Head)和“主体”部分(Body)，其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。)

2、JavaScript或者jQuery添加切换效果(JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML(标准通用标记语言下的一个应用)网页上使用，用来给HTML网页增加动态功能。)

但是，采用JavaScript或者jQuery的方法显示更多的内容会产生影响页面的反映速度、维护不易从而使得用户体验性差的问题。

发明内容

本发明要解决的技术问题是为了克服现有技术中采用JavaScript或者jQuery的方法显示更多的内容会产生影响页面的反映速度、维护不易从而使得用户体验性差的问题缺陷，提供一种基于CSS展示网页的方法和装置。

本发明提供一种基于CSS展示网页的方法，其特点是，所述方法包括：

基于CSS在网页中设置tab选项卡，所述tab选项卡包括控制区和内容区；

所述内容区包括显示内容，所述显示内容默认为隐藏状态；

所述控制区包括按钮，在所述按钮为选中状态时，所述内容区将所述显示内容切换为显示状态。

其中，CSS(层叠样式表，Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

其中，基于CSS在网页中设置tab选项卡，包括：

在HTML中创建一个DIV(用来为HTML文档内大块(block-level)的内容提供结构和背景的元素)作为对应于tab选项卡的外层容器；

在所述外层容器中创建至少一个新的DIV，每个新的DIV分别作为一个内容模块；

在所述内容模块中创建位于所述控制区的按钮和位于所述内容区的显示内容。

较佳地，基于CSS在网页中设置tab选项卡，还包括：

利用CSS修饰所述DIV和/或所述新的DIV的样式。

本发明还提供一种基于CSS展示网页的装置，其特点是，所述装置包括：

设置单元，用于基于CSS在网页中设置tab选项卡，所述tab选项卡包括控制区和内容区；

所述内容区包括显示内容，所述显示内容默认为隐藏状态；

所述控制区包括按钮，在所述按钮为选中状态时，所述内容区将所述显示内容切换为显示状态。

较佳地，基于CSS在网页中设置tab选项卡，包括：

在HTML中创建一个DIV作为对应于tab选项卡的外层容器；

在所述外层容器中创建至少一个新的DIV，每个新的DIV分别作为一个内容模块；

在所述内容模块中创建位于所述控制区的按钮和位于所述内容区的显示内容。

较佳地，基于CSS在网页中设置tab选项卡，还包括：

利用CSS修饰所述DIV和/或所述新的DIV的样式。

在符合本领域常识的基础上，上述各优选条件，可任意组合，即得本发明各较佳实例。

本发明的积极进步效果在于：本发明能够显示网页中更多的内容，同时不会影响页面的反映速度和用户体验性，另外，本发明制作Tab选项卡无需使用任何jQuery和JavaScript脚本，在不支持脚本的浏览器中也能正常运行。

附图说明

图1为利用本发明实施例的基于CSS展示网页的方法设置的tab选项卡在第一按钮为选中状态时第一选项卡和第二选项卡的显示状态。