html——鼠标移动到块显示菜单

对明天的期待丶

于 2018-09-27 19:41:01 发布

阅读量5.3k

点赞数 1

文章标签： html omouseover

本文链接：https://blog.youkuaiyun.com/qq_39429962/article/details/82872150

版权

本文介绍了如何在前端开发中使用HTML实现鼠标移到块元素上时显示菜单的功能，通过一个简单的实例展示了类似拉勾网的菜单特效。通过CSS控制显示和隐藏，为多层布局提供交互体验。

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

我们在做前端布局的时候，当我们想要实现多层布局时，就会想到鼠标移动显示和消失显示菜单，就例如拉勾网的菜单特效，下面是一个简单点的实例：

showDiv.html:

<!DOCTYPE html>
<html>
	<head>
		<title>显示div</title>
		<link rel="stylesheet" type="text/css" href="show.css"/>
	</head>
	<body>
		<div class="menu">
			<div class="menu_1" onmouseover="show('showdiv1')" onmouseout="mOut('showdiv1')">
				<div class="menu_1_text1">技术</div>
				<div class="menu_1_text2">Java</div>
				<div class="menu_1_text2">PHP</div>
				<div class="menu_1_text2">C++</div>
				<div class="menu_1_img"></div>
				<div class="showdiv" id="showdiv1">
					<div class="showd

最低0.47元/天解锁文章