html菜单列表(html二级菜单怎么做)

编程之家2026-06-01891次浏览

这篇文章给大家聊聊关于html菜单列表，以及html二级菜单怎么做对应的知识点，希望对各位有所帮助，不要忘了收藏本站哦。

html代码一个菜单导航希望前辈指点

<html></html>:网页开始和结束标签

<head><title>:浏览器标题标签

<body>:网页内容标签

<h1>-<h6>:网页内容标题标签

<p>:网页内容中段落的标签

<br/>:网页内容中段落的折行标签

align="center"：居中属性定义标签

<hr/>：水平线定义标签

：隐藏注释定义标签

<body background="图片地址">：网页背景图片定义标签

<body bgcolor="颜色代码或名称">：网页背景颜色定义标签

<font color="99FF33">你好吗</font>:字体颜色标签

<img src="/i/eg_mouse.jpg"width="40" height="40">:调整图像尺寸

<bgsound src="音乐地址" loop=-1>：背景音乐

表格边框:<table border="1">

预格化定义标签:<pre>预格内容</pre>

超链接定义标签：<a rel="external nofollow" href="链接地址">显示内容</a>

文字反方向标签：<bdo dir="rtl">要反方向的内容</bdo>

块引用标签：<blockquote>内容</blockquote>

删除字效果标签：<del>内容</del>

插入字效果标签：<ins>内容</ins>

插入图片定义标签：<img border="0" src="图片地址"/>

定义超链接在新窗口中打开标签：target="_blank"

连接到同一个页面的不同位置标签：

<a rel="external nofollow" href="#自定义命名">要连接的目标名</a>

<a name="自定义命名">被连接的目标</a>

创建电子邮件连接标签：

网页垂直框架定义标签：

</frameset>

在此标签中当开始标签后面的：cols改为rows时变为水平框架

当二者都用时就定义了混合框架

定义框架不能被拉动标签：noresize="noresize"

size="number" size="2"定义字体大小。

size="+number" size="+1"增加字体的大小。

size="-number" size="-1"减少字体的大小。

face="face-name" face="Times"定义字体名称。

color="color-value" color="#eeff00"定义字体颜色。

color="color-name" color="red"定义字体颜色。

autoplay如果出现该属性，则音频在就绪后马上播放。

controls如果出现该属性，则向用户显示控件，比如播放按钮。

preload如果出现该属性则音频在页面加载时进行加载并预备播放

如果使用"autoplay"，则忽略该属性。

src url要播放的音频的 URL

html+css下拉菜单怎么制作

使用HTML和CSS制作下拉菜单的方法如下：

1、编写带有div导航的html代码：

2、使用class=“nav”属性的‘div’标签作为菜单的容器。在截图中，在图示的HTML代码中，一个简单的无序列表（ul）来表示主菜单项。

3、在主菜单区域中添加链接。在本步骤中，在无序列表（ul）每一项上添加链接。

4、在“关于我们（About Us）”下方LI标签内添加一个无序列表，它代表其子菜单的链接。

5、制作导航css：

html 怎么做鼠标悬浮菜单上的选项能出现下拉菜单

html做鼠标悬浮菜单上的选项能出现下拉菜单，CSS+JS做出此效果。

<body>内代码为：

<ULid=fm>

<LI><Arel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" href="#">一级菜单栏目</A>

<UL>

</LI>

<UL>

</UL></LI>

<UL>

</UL></LI></UL>为了突出效果，做的CSS样式代码为：

<STYLEtype=text/css>

*{margin:0;padding:0;border:0;}

#fm{line-height:24px;list-style-type:none;background:#666;}/*设置盒子的行高，去掉标记，设置背景颜色*/

#fma{display:block;width:80px;text-align:center;}/*设置A标签为块元素不显示，宽度，居中*/

#fma:link{color:#666;text-decoration:none;}/*设置未访问的链接样式*/

#fma:visited{color:#666;text-decoration:none;}/*设置已访问的链接样式*/

#fma:hover{color:#FFF;text-decoration:none;font-weight:bold;}/*当有鼠标悬停在链接上的颜色*/

#fmli{float:left;width:150px;background:#CCC;}

#fmlia:hover{background:#999;}

#fmliul{line-height:27px;list-style-type:none;text-align:left;left:-999em;width:80px;position:absolute;}

#fmliulli{float:left;width:80px;background:#F6F6F6;}

#fmliula{display:block;width:80px;width:80px;text-align:left;padding-left:5px;}

#fmliula:link{color:#666;text-decoration:none;}

#fmliula:visited{color:#666;text-decoration:none;}

#fmliula:hover{color:#F3F3F3;text-decoration:none;font-weight:normal;background:#C00;}

#fmli:hoverul{left:auto;}

#fmli.sfhoverul{left:auto;}

#content{clear:left;}

</STYLE>js代码为：

<SCRIPTtype=text/javascript>

functionmenuFix(){

varsfEls=document.getElementById("fm").getElementsByTagName("li");

for(vari=0;i<sfEls.length;i++){

sfEls[i].onmouseover=function(){

this.className+=(this.className.length>0?"":"")+"sfhover";

}

sfEls[i].onMouseDown=function(){

this.className+=(this.className.length>0?"":"")+"sfhover";

}

sfEls[i].onMouseUp=function(){

this.className+=(this.className.length>0?"":"")+"sfhover";

}

sfEls[i].onmouseout=function(){

this.className=this.className.replace(newRegExp("(?|^)sfhover\\b"),

"");

}

window.onload=menuFix;

</SCRIPT>最后的效果图为：

以上就是用html做鼠标悬浮菜单上的选项能出现下拉菜单的解决方法。

如果你还想了解更多这方面的信息，记得收藏关注本站。

十个常用的html标签？html所有标签及其属性基础编程入门教程编程入门

html菜单列表(html二级菜单怎么做)

html代码 一个菜单导航希望前辈指点

html+css下拉菜单怎么制作

html 怎么做鼠标悬浮菜单上的选项能出现下拉菜单

html代码一个菜单导航希望前辈指点