设为首页 | 收藏本站
首页>IT学院>网页设计>正文
CSS自动实现网页打印版本
WWW.DBIT.CN 2006-11-2 8:46:24 热度:
 

下面通过创建一个鼠标滑过加亮显示的 HTC 来演示一下创建 HTC 的过程。 1、创建 HTC 文件的架构。一个标准的 HTC 文件含有一个 SCRIPT 块和一对可选的 COMPONENT 标记。

以下是引用片段:

<PUBLIC:COMPONENT>

<SCRIPT>

</SCRIPT>

</PUBLIC:COMPONENT>

2、写一个可执行的脚本。

在下面的代码中,ATTACH 被用于设置 HTC 接收元素在 onmouseover 和 onmouseout 事件被触发的消息。它通知 HTC 通过切换颜色来体现鼠标滑过元素时的加亮效果。

以下是引用片段:

<PUBLIC:COMPONENT>

<PUBLIC:ATTACHEVENT="onmouseover"ONEVENT="Hilite()"/>

<PUBLIC:ATTACHEVENT="onmouseout"ONEVENT="Restore()"/>

<SCRIPTLANGUAGE="JScript">

varnormalColor,normalSpacing;

functionHilite()

{

//saveoriginalvalues

normalColor=runtimeStyle.color;

normalSpacing=runtimeStyle.letterSpacing;

runtimeStyle.color="red";

runtimeStyle.letterSpacing=2;

}

functionRestore()

{

//restoreoriginalvalues

runtimeStyle.color=normalColor;

runtimeStyle.letterSpacing=normalSpacing;

}

</SCRIPT>

</PUBLIC:COMPONENT>

将上面保存为hilite.htc文件。

注意:您可以直接使用属性、方法或者是事件的名称来访问它们,并不需要在前面加上 element 的前缀。在前面的例子中我们注意到在切换颜色时我们直接调用了 runtimeStyle ,而不是使用 element.runtimeStyle。

3、一旦执行,这个 HTC 就能在网页中应用来达到鼠标滑过加亮的效果。

以下是引用片段:

<HEAD>

<STYLE>

LI{behavior:url(hilite.htc)}

</STYLE>

</HEAD>

以下是引用片段:

<P>Mouseoverthetwolistitemsbelowtoseethiseffect.

<UL>

<LI>网页陶吧</LI>

<LI>homepage.yesky.com</LI>

</UL>

 
上一篇:网页制作教程:认识CSS的伪类
下一篇:改进网页可读性的7个方法
打印】【关闭
  相关文章:
·网页制作:CSS的常用技巧放送·动态CSS,换肤技术
·使用图片和CSS结合制作动画按钮·CSS中display 与visibility 的区别
·XHTML+CSS布局之XHTML应用小结·CSS超级技巧大放送合集
·网站设计之合理架构css·认清CSS的类class和标识id选择符
·网页制作教程:认识CSS的伪类·使用html表格和CSS进行混合网页设
·CSS的“顶级”技巧·如何使用CSS来进行网页排版
·网页设计引入CSS样式的五种方式·用CSS代码轻松Diy你的网页滚动条
·采用DIV+CSS布局的好处·Dreamweaver入门使用CSS设置页面格
☆联姻学院☆

保养电脑的26个窍门
文件夹删除不掉怎么办?
教你如何用手工迅速剿灭QQ广告
“熊猫烧香”病毒的病毒描述和
在Excel中只打印图表以外区域
Excel中只选中包含文本的单元
Windows XP操作系统的几个实用
用XP系统自带网络诊断程序解决
风雨雷电→自然现象动画实战技
Flash遮罩特效之百叶窗效果
十二个Dreamweaver鲜为人知的
如何用 Dreamweaver 批量做we
JavaScript的系统函数学习
Java之父:关于Java我也有遗憾
排除网上邻居使用4大常见麻烦
解除上网限制IP和MAC捆绑的破