html导航条怎么设置

1、用Dreamweaver新建一个HTML文件

2、按ctrl+s先保存，以防突然断电数据丢失

3、修改title为html+css实现横向导航

4、新建一个div  id为“a”，添加ul li标签

5、在li中添加自己想要的文字 并调整好文字间距,按F12预览，如下图所示:

6、首先去掉字体前面的小黑点，代码如下：

7、预览，如图所示:

8、接下来，使文字横向排列，设置代码如下，给li设置左浮动效果；

9、按F12预览，效果如下：

function menuFix() {

var sfEls = document.getElementById("nav").getElementsByTagName("li")

//获得id为nav下的所有li标签对象组成的数组

for (var i=0i<sfEls.lengthi++) {//遍历数据并依照一下的4中方式处理

sfEls[i].onmouseover=function() {//当鼠标经过的时候事件

this.className+=(this.className.length>0? " ": "") + "sfhover"//如果原li存在class.赋予新的“class为原名”+" "+"sfhover",如果不存在则给class赋为"sfhover"

}

sfEls[i].onMouseDown=function() {//当鼠标按下的时候的事件

this.className+=(this.className.length>0? " ": "") + "sfhover"//同上；

}

sfEls[i].onMouseUp=function() {//当鼠标d起的时候的时事件

this.className+=(this.className.length>0? " ": "") + "sfhover"//同上；

}

sfEls[i].onmouseout=function() {//当鼠标移开该li区域的时候的事件

this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"), //还原为鼠标移动到li上前的class

"")

}

}

}

导航栏左logo右文字弄html的方法如下

1.用Dreamweaver新建一个HTML文件

2.按ctrl+s先保存，以防突然断电数据丢失

3.修改title为html+css实现横向导航

4.新建一个div ?id为“a”，添加ul li标签

5.在li中添加自己想要的文字并调整好文字间距，按F12预览；

6.首先去掉字体前面的小黑点；

7.预览；接下来，使文字横向排列，设置代码如下，给li设置左浮动效果；

8.按F12预览，导航栏左logo右文字已转化成html。

---