[计算机软件及应用]html-CSS-JS.pptVIP

* 例: head元素中的JavaScript代码j-01.htm 程序说明： 当网页执行到body元素时，触发load事件，再调用message()函数，最后在浏览器中显示“在head”信息。 * 2 在body元素中 与head元素中的JavaScript类似，body元素中的JavaScript代码也要包含于script type=text/JavaScript…/script之间。 * 例：body元素中的JavaScript代码 源程序： j-02.htm 在页面载入时执行docment.write方法输出XHTML文本“在ltbodygt元素中”，浏览器上显示效果是“在body元素中”。 注意：“”在程序中用“lt”表示；“”用“gt”表示。 * 3 在独立的.js文件中 独立的.js文件常用于多个页面需要调用相同JavaScript代码的情形。 通常把所有.js文件放在同一个脚本文件夹中，这样容易管理。 在调用外部JavaScript文件时，需在script元素中加入src属性值，指定外部js文件的位置。 script src=“***.js type=text/javascript“ /script * 例:j-03.htm 调用独立的j-03.js文件 程序说明： 在j-03.htm文件中，src属性表示独立的.js文件存放位置；当网页执行到body元素时，触发load事件并调用j-03.js中的message()函数。 注意：在.js中不要包含script元素。 * 例j-04: 检测浏览器类型 本实例将检测浏览器类型，如果浏览器为Netscape或4.0以上版本的IE，则显示“您的浏览器满足要求！”，否则显示“请更新您的浏览器”。 源程序： j-04.htm 程序说明： “//……”表示语句注释； navigator.appName返回“浏览器名”； navigator.appVersion返回“浏览器版本号”； parseFloat()将字符型数据转化为浮点型数据； * 例: j-05 按钮动画 源程序： j-05.htm和j-05-01.html(DR自动生成交换图片相关程序) 程序说明： 网页载入后显示eg_mouse2.jpg；当鼠标指针指向图片时触发mouseover事件调用mouseOver()函数显示eg_mouse.jpg，移开时触发mouseout事件调用mouseOut()函数显示eg_mouse2.jpg；单击后链接到。 * 例: j-06 计时器在不同页面的显示 源程序： j-06.htm、t-06.aspx和e-04.html 程序说明： 网页载入后调用startTime()函数在div层txt上显示当前系统时间。 * * style标记内定义的前后加上注释符!--...--的作用 style标记的属性type，指明样式的类别，除了有CSS外，还有Netscape的JSS（JavaScipt Style Sheets），其样式类别为”text/javascript” * 当设置一个盒模型的的margin:auto;时，可以让这个盒模型居中。 * * * 2.定义内部样式表 e-06.HTML * 例：使用CSS控制文字显示特性 e-07.HTML * 3.链接外部样式表 将样式表定义为一个独立的CSS样式文件，扩展名为.css； 使用该样式表的HTML文件在头部用link标记链接到这个CSS样式文件即可。 优点：不但本页可以调用，其它页面也可以调用，是最常用的一种形式。 e-08.HTML rel：表示链接的类型，如样式表； href：指定CSS样式文件，是一个URL； type：指出样式的类别，是一个包含CSS的文本文件； * 例样式表文件： style1.css * 例：e-09.htm引用样式表style2.css css样式表：style2.css 源程序：e-09.htm e-09.HTML style2.css * CSS属性 字体属性 字体（font-family） 字号（font-size） 字体风格（font-style） 字体加粗（font-weight） 字体变化（font-variant） 字体综合设置（font）属性 * CSS属性 2. 颜色和背景属性 （前景）颜色（color） 背景颜色（background-color） 背景图象（background-image） 背景重复（background-repeat） 背景附属方式(background-attachment) 背景图象位置(background-position) 背景属性（backgr