DIV+CSS：二级导航的制作代码

最新推荐文章于 2021-06-07 12:50:21 发布

cenyebao

最新推荐文章于 2021-06-07 12:50:21 发布

阅读量3.4k

点赞数

分类专栏： JS_div+css_23 文章标签： css div function border xhtml menu

本文链接：https://blog.csdn.net/cenyebao/article/details/6164806

版权

这篇博客展示了如何利用HTML、CSS和JavaScript实现一个二级导航菜单。通过为`<li>`元素添加鼠标悬停事件，改变类名来实现菜单项的高亮效果。CSS用于定义菜单的样式，包括宽度、边框、背景色等，而JavaScript部分则用于在鼠标移入和移出时切换`current`类，以显示和隐藏子菜单。

摘要由CSDN通过智能技术生成

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<script type="text/javascript">
    startList = function() {
        if (document.all&&document.getElementById) {
            navRoot = document.getElementById("menu");
            var allli = navRoot.getElementsByTagName("li")
            for (i=0; i<allli.length; i++) {
                node = allli[i];
                node.οnmοuseοver=function() {
                    this.className+=" current";
                }
                node.οnmο