分类“CSS与其他技术”的存档

CSS与Javascript的综合应用 - CSS与其他技术 - 第1课

2007年06月15日 星期五

本节课时长13分02秒,下载文件11.5兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载

Javascript与CSS一样,是可以在客户端浏览器上解析并执行的脚本语言,所不同的是Javascript是类似C++、Java等的基于对象的语言。通过Javascript与CSS相配合可以实现很多动态的页面效果,例如前面介绍过的“变色的表格”、“随机选取CSS文件”都是CSS与Javascript结合的很好范例。本课围绕Javascript与CSS的配合,进一步介绍各种动态网页的效果。

  • 实例一:输入时高亮的Excel表格
  • 实例二:由远到近的文字
  • 实例三:跑马灯特效
  • 实例四:图片淡入淡出
  • 实例五:CSS实现PPT幻灯片
  • 实例六:灯光效果
  • 实例七:舞台灯光
  • 实例八:探照灯
  • 实例九:鼠标文字跟随

CSS与XML的综合运用 - CSS与其他技术 - 第2课

2007年06月18日 星期一

本节课时长13分03秒,下载文件7.53兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载

XML是eXtensible Markup Language的缩写,即可扩展标记语言。它是一种可以用来创建自定义标记的语言,由万维网协会(W3C)创建,用来克服HTML的局限。从实际功能上来看,XML主要用于数据的存储,而HTML则主要用于数据的显示。本课重点介绍XML的基础知识、XML与CSS的关系,以及将二者结合在一起的简单使用方法。

1.XML基础

XML是可扩展标记语言的简称,它结构化的定义数据标准的格式。我们在这里主要介绍XML的基础知识,包括XML的特点、XML与HTML的联系、XML的语法、XML的编写等等。希望大家能了解以下几个要点:

  • XML的特点
  • XML与HTML
  • XML基本语法

2.XML链接CSS文件

XML的主要用途是文件数据结构的描述,但XML并没有办法告诉浏览器,这些结构化的数据应该怎样显示出来。与HTML的原理类似,通过链接外部的风格样式文件,就能够很好的显示数据。我们在这里主要介绍XML调用CSS的方法,以及CSS如何控制XML页面中的各个元素。
与HTML页面一样,在XML中同样可以链接外部的CSS文件,来控制各个标记,其方法与HTML外部链接CSS文件很类似,简单的示例如下所示。

3.XML文字阴影效果

前面介绍了XML如何链接CSS文件的方法,我们在这里通过具体的实例,进一步学习CSS控制各个XML中数据的技巧。本例利用CSS的定位,在XML中实现类似前面的“文字阴影”的效果。

[点击这里查看本文全文……]

CSS与AJAX的综合应用 - CSS与其他技术 - 第3课

2007年06月19日 星期二

本节课时长15分14秒,下载文件23.1兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载

Ajax(Asynchronous JavaScript and XML,异步JavaScript和XML)是目前很新的一项网络应用技术。确切的说Ajax不是一项技术,它是一组技术的集合,它能使浏览器为用户提供更为自然的浏览体验,就像在使用桌面应用程序一样。本课首先介绍AJAX的基础知识,然后重点讲解CSS在AJAX中的重要地位,以及简单的AJAX使用方法。

1.AJAX概述

Ajax是一项很有生命力的技术,它的出现引发了web应用的新一轮革命。目前网上的众多站点,使用Ajax技术的还非常有限,但可以预见在不远的将来,Ajax必然成为整个网络的主流。我们在这里主要对Ajax技术作概括性的介绍,包括Ajax的组成以及基本原理等。

  • 什么是AJAX
  • AJAX的关键元素
  • CSS的重要地位

2.AJAX入门

正如上一节所提到,Ajax作为一项新的web技术,结合了4种不同技术,实现了客户端与服务器端的异步通讯,并且对页面实行局部更新,大大增强了浏览的速度。Ajax的内容十分丰富,它能够将一个页面制作成强大的桌面应用程序,就像Google Map、Google Moon、Gmail等。关于Ajax的详细介绍,有兴趣的读者可以参考其它相关资料,我们在这里只是通过简单的实例,对Ajax进行初步的了解。

  • 创建XMLHttpRequest对象
  • 发出AJAX请求
  • 处理服务器响应
  • 加入CSS样式

3.AJAX实例:能够自由拖动布局区域的网页

如前面描述的,Ajax综合了各方面的技术,不但能够加快用户的访问速度,使得应用网页就像使用桌面应用程序一样,还可以实现各种特效。我们在这里以简单的拖动布局区域为例,展示Ajax的强大功能,并利用CSS修改页面的风格样式,效果如图所示。