HTML竖向弹出菜单带鼠标划动效果代码

HTML竖向弹出菜单带鼠标划动效果代码

学习目地：今天要给大家讲下弹出菜单升级版，多了一个二级菜单鼠标移动效果，下面会使用到HTML语言+CSS语言+鼠标

和

伪类。如果还没具备以上三种能力，下面讲的理论会很难理解。请先从头看下我以前讲的内容，代码准备如图1。

代码准备

从图1代码中可以看出代码设计原理是，通过HTML语言

标签容器载入多个HTML语言无序列表标签

和

嵌套，在用CSS语言控制HTML语言外观并利用鼠标事件伪类:hover实现弹出式动作，然后在设计嵌套无序列表鼠标事件伪类:hover移动鼠标改变背景色。

（图片来自网络，图1）

把图1中的代码输入到记事本中，然后把代码另存为HTML文件如图2

（图片来自网络，图2）

打开图2，如果可以正确显示出图2的效果，就说明HTML语言的ul和ｌｉ标签已经成功给控制了。当我们把鼠标移动到图２中的文字上，那么就会弹出一个无序列表框，那么就说明我们的鼠标伪能已经正常运行了，如图３.

（图片来自网络，图3）

（图片来自网络，图4）

**************EMD**************

部分内容参考网络，本文只限于学习交流请勿它用

***********************************