怎样能给网页文字加上即时提示

时间：2021-04-16

　　即时提示是Windows应用软件的一种富有人情味的特色设计。当用户不知道一个文字或图片按钮的功能时，只要把鼠标移动到这个按钮，就会出现一个即时提示短语。在制作网页时,同样可以借助HTML语言给网络文档加上即时提示功能。

　　我们在开发英语网络教材时，就利用了即时提示功能给每个生词加上中文注释。在本例中，对初三英语课文中的“Christmas is an important festival in Britain and many other parts of the world.”一句中的生词Christmas、festival、Britain分别加上注释功能，当用户将鼠标移动到这些单词上面时，就会在鼠标的旁边显示相应注释。

　　那么，在网页中如何实现这种即时提示功能呢？下面介绍两种实现方法：

　　在鼠标旁边显示即时提示信息

　　这种方法是巧妙地利用HTML语言提供的标题元素<TITLE>...</TITLE>。在新的HTML 4.0规范中，
　　<TITLE>...</TITLE>可以支持几乎所有的元素，在本例中是将它与行内元素<SPAN>...</SPAN>配合使用。<SPAN>...</SPAN>元素是HTML 4.0规范新增加的通用行内容元素，在本例中利用它将要设置提示信息的单词隔离开并分别设置各单词的TITLE属性。

　　实现的源代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>网页即时提示演示 </TITLE>
<!STYLE元素定义顶级元素BODY与行内元素SPAN的样式>
<STYLE>
BODY {cursor:default}
SPAN {background-color:yellow}
</STYLE>
</HEAD>
<BODY>
<H3>Unit 14 Lesson 54</H3>
<P>
<!用行内元素SPAN将各个要设置提示的单词单独括起来并用TITLE元素设置提示信息>
<!本例中要设置提示信息的单词分别为Christmas、festival、Britain>
<SPAN TITLE="Christmas--n.圣诞节">Christmas </SPAN> is an important
<SPAN TITLE="festival--n.&&&&adj.节日(的);喜庆(的)">festival </SPAN>
in <SPAN TITLE="Britain--n.英国;不列颠">Britain </SPAN> and many other
parts of the world.
</P>
</BODY>
</HTML>

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章