网页基础第4课之“简单的JS与CSS结合--鼠标移入移出事件”

最新推荐文章于 2024-04-23 10:36:46 发布

妩媚坏女孩

最新推荐文章于 2024-04-23 10:36:46 发布

阅读量1.4k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/sinat_16876607/article/details/39889463

本文介绍了一个简单的HTML示例，展示了如何使用onmouseover和onmouseout事件改变超链接文本的字体大小，实现了鼠标移入和移出时的不同效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

题目：

在HTML文档中包含一个超链接文本，要实现当鼠标移入该链接时，超链接文本大小变为80px （提示鼠标移入事件为 onmouseover=""）

<a href="#" onmouseover="________">I love you.</a>

答案：

<span style="font-size:10px;">this.style.fontSize='80px';</span>

扩展：

在上面题目的基础上，实现鼠标移出时文本大小变为10px的完整代码。

完整代码：

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>鼠标移入移出事件</title>
</head>
<body>
    <a href="#" onmouseover="this.style.fontSize='80px';" onmouseout="this.style.fontSize='10px';">I love you.</a>
</body>
</html>