html中导航条如何设置,html做网页导航条代码

　　转载请注明出处：http://blog.csdn.net/lindonglian

　　首先准备网页背景图片和导航背景图片，放在同一目录下的形象文件夹中

　　编写超文本标记语言文件

　　！DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www。w3。org/TR/XHTML 1/DTD/XHTML 1-过渡。DTD html xmlns= http://www。w3。org/1999/XHTML head meta http-equiv= Content-Type Content= text/html；charset=utf-8 /title无标题文档/title link href= styles/navigation。CSS rel= style sheet type= text/CSS //head by header nav ul lia href= # title=首页target=_blank 首页/a/li lia href=# title=国内新闻target=_blank 国内新闻/a/li lia href=# title=国外新闻target=_blank 国外新闻/a/li lia href=# title=娱乐新闻target=_blank 娱乐新闻/a/li lia href=# title=时事新闻target=_blank 时事新闻/a/li lia href=# title=联系我们target=_blank 联系我们/a/li /ul /nav/header/body/html接下来写样式表，常规放在同一目录下的风格文件夹中

　　看看样式带来的变化

　　给网页添加背景图片

　　@ charset utf-8 ；body { margin:0px；背景-图像：url(./图片/背景。jpg)；背景-重复：不重复；宽度：800px}

　　加个导航

　　导航{ float:左；宽度：920像素高度：40px背景-图像：url(./图像/导航。jpg)；边距：100像素0 0填充：0;}

　　无序列表

　　导航ul { float:left；边距：0px填充：0 0 0 0;宽度：920像素列表样式：无；}

　　让链接横排

　　nav ul Li { display:inline；}

　　阿利导航{浮动：左；填充：11像素20像素字体大小：14px文本对齐：居中；文字-装饰：无；背景：网址（./images/template mo _ menu _ dividerpng)居中右无重复；颜色：# fff字体系列：Tahoma大纲：无；}

　　鼠标经过该链接，呈现深绿色

　　阿利导航：悬停{ color:# 2a5f 00；}

　　到此这篇关于用HTML5做的导航条详细步骤的文章就介绍到这了，更多相关html5导航条内容请搜索以前的文章或继续浏览下面的相关文章，希望大家以后多多支持！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。