html框架如何实现左边为导航栏,右边为连接页面,代码写出来

html-css019

html框架如何实现左边为导航栏,右边为连接页面,代码写出来,第1张

1、首先打开Deamweaver8，新建一网页文件，接着输入以下导航菜单的内容。

2、此时对应效果如图。

3、接下来准备相关的导航按钮图片（可以事先利用PS制作好）。

4、然后将以下CSS代码加入到<head></head>之间。

5、网页此时的效果如图，就完成了。

<script>

function js(id)

{

return document.getElementById(id).getElementsByTagName("div")

}

for(var i=0i<js("left").lengthi++)

{

js("left")[i].onclick=function(){

delBackgroundColor()

this.style.background = "#06C"

this.style.color = "#fff"

}

}

function delBackgroundColor()

{

for(var i=0i<js("left").lengthi++)

{

js("left")[i].style.background = ''

js("left")[i].style.color = '#384463'

}

}

</script>

把上面的代码复制到你的<body>标签的最下面就可以了。。