一种基于Div+CSS+JavaScript的网页布局特效研究

来源 :电脑知识与技术·学术交流 | 被引量 : 0次 | 上传用户:ck198
下载到本地 , 更方便阅读
声明 : 本文档内容版权归属内容提供方 , 如果您对本文有版权争议 , 可与客服联系进行内容授权或下架
论文部分内容阅读
  摘要:本文介绍了一种使用DIV CSS Javascript设计选项卡式网页布局方法,分别讨论了选项卡居左、居右、居上和居下四种效果。该方法简单、实用,既能保持网页的信息量,又可以极大地节省网页空间。
  关键词:DIV; CSS;JavaScript;网页设计
  中图分类号:TP311文献标识码:A文章编号:1009-3044(2008)17-21556-03
  
  1 引言
  
  业界越来越关注DIV CSS的标准化设计,大到各大门户网站,小到不计其数的个人网站,在Div CSS标准化的影响下,网页设计人员已经把这一要求作为行业标准。Div 全称 division 意为“区分”使用 DIV 的方法跟使用其他 tag 的方法一样。DIV本身就是容器性质的,你不但可以内嵌table还可以内嵌文本和其它的HTML代码。CSS是Cascading style Sheets的简称,中文译作“层叠样式表单”,在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。
  使用DIV CSS进行网页设计,最大的特点是表现和内容相分离,结构清晰,重构性强,大大缩减页面代码,提高页面浏览速度,缩减带宽成本。除此之外,如何在网页中相同空间内尽可能部署更多的内容也是网页设计需要考虑的重要内容。
  本文给出一种解决方案,在div css进行网页布局的基础上,使用Javascript控制页面属性,效果如图1所示。
  
  这种网页布局主要由三部分组成,选项卡菜单,内容区块及包含两者的div容器。当鼠标移动到某个选项卡菜单上,该菜单高亮显示,对应的内容在内容区块显示。下面分别以选项卡菜单居左、居右、居上和居下四种情况进行介绍。
  
  2 菜单居左
  
  效果如图2所示,其中a 菜单项b menuleft。
  
  2.1 div布局
  在网页区域中,编写如下代码:
  
其他文献
摘要:远程教学系统是远程教育的重要组成部分,目前的远程教学系统的设计与实现主要基于C/S(B/S)技术,新兴的P2P技术与C/S(B/S)技术相比,具有网络可伸缩性好、健壮性强、资源的利用率较高、节省投资等优点。论文介绍如何利用基于JXTA的P2P技术来构建一个远程教学系统的过程。  关键词:JXTA;P2P;远程教育;远程教学系统  中图分类号:TP311文献标识码:A文章编号:1009-304
摘要:VLAN作为控制广播风暴,增强网络安全性的一种技术手段,越来越广泛的应用到了局域网当中。文中简要介绍了VLAN的技术特点并结合两个配置实例着重介绍了目前主要的VLAN技术。  关键词:VLAN;网络安全;交换机  中图分类号:TP393文献标识码:A文章编号:1009-3044(2009)24-6871-03    Virtual Local Area Network (VLAN) Tech
摘要:在MATLAB中,M文件的计算速度特别是循环迭代的速度远比C语言慢,因此可以把要求大量循环迭代的部分用C语言编写为MEX文件,然后在MATLAB中调用此文件,以提高计算速度。该文通过实例详述了如何实现此过程。  关键词:MATLAB;C;MEX文件;接口  中图分类号:TP312文献标识码:A文章编号:1009-3044(2009)24-7002-02    Implementation o
摘要:本文介绍了Microsoft用于建立和运行面向服务的应用程序的统一框架WCF的系统结构和技术要素,分析了WCF用于分布式开发的优点及项目的多层开发技术,并通过开发具体分布式应用程序来展现基于WCF构架的分布式应用程序的编程步骤与技巧。  关键词:WCF;SOA;分布式  中图分类号:TP309.05文献标识码:A文章编号:1009-3044(2008)19-30068-03  Distrib
摘要:该文先分析了P2P的工作原理,详细地对有NAT之时P2P如何穿越进了描述,再对现有的视频压缩技术进行阐述与对比,再应用P2P技术及服务器技术,详细地介绍了系统的设计方法与思路。  关键词:P2P;视频会议系统;NAT  中图分类号:TP393文献标识码:A文章编号:1009-3044(2009)24-6645-03    随着Internet技术的发展,家庭及企事业单位接入互联网已成为现实。
摘要:主要研究扩展的UML与XML Schema的建模方法,并设计一种基于XML Schema到扩展的UML的建模算法。利用该法,开发基于XML文档后勤管理系统。  关键词:统一建模语言;扩展的标记语言模式;建模算法;后勤管理系统  中图分类号:TP311 文献标识码:A 文章编号:1009-3044(2008)03-10463-05
摘要:该文在深入研究Grid Services技术的一些最新学术和应用成果基础上,结合目前水库洪水预报系统的需求分析和设计原则,系统地论证了使用Grid Services技术实现水库洪水预报系统可行性和优势。同时根据系统特性和要求,给出了基于Grid Services的水库洪水预报系统的基本框架结构,为实现在Internet环境下进行洪水预报调度提供了分布式计算平台。  关键词:Grid Serv
摘要:该文主要研究了基于Symbian智能手机操作平台的垃圾短信的研究,在设计上提出特有的分层过滤方法,结合手机通信录号码簿,公共号码名单里的电话号码以及对短信内容进行相关关键字匹配的过滤这三个“关口”进行过滤,同时提出了一种短信过滤领域较新颖的BM过滤算法的研究。该方法对于短文本的过滤精确率较高,对于资源有限的手机操作平台运行不受影响,从而增加了算法的可行性。  关键词:Symbian;垃圾信息
摘要:该文介绍了利用Authorware的一个数据库编程接口——ODBC.U32动态链接库功能与数据库进行连接,实现题目和程序的分离。  关键词:Authorware;ODBC;数据库  中图分类号:TP311文献标识码:A文章编号:1009-3044(2008)30-0623-03    DataBase Programming Based on ODBC Technology in Autho
摘要:在系统运行中我们经常会遇到由于文件损坏导致启动的问题,但是在Linux中我们可以利用Linux的新技术让系统每次从内存启动,并且每次启动完后把完整的文件系统解压到内存,避免了系统从损坏的文件系统启动。这不仅使系统能正常启动,而且提高了系统性能。  关键词:Linux;嵌入式;文件系统  中图法分类号:TP309 文献标识码:A 文章编号:1009-3044(2008)07-11232-02