本文目录
- html如何做一个侧面的导航栏
- 如何在html中实现 左边导航条
- html框架，为什么左边的导航栏，一定在右边显示为什么不在上面框架显示什么原理！！紧急，谢谢啦
- html如何实现pc端导航栏在顶部手机端导航栏在左侧
- html左导航菜单拉伸,右边文章也跟着变怎么解决
- HTML编写左侧导航栏 要求如下图
html如何做一个侧面的导航栏
你的导航是浮动不随网页上下滚动条移动可以使用：div{ position:fixed; left:0; top:0; width:100px; height:100%;}
如果是跟随内容改动，你的内容区分左右两块，左边写你的导航就可以了
如何在html中实现 左边导航条
《html》
《head》
《title》TOC and Content Frames《/title》
《/head》
《frameset cols=“200,*“ frameborder=yes framespacing=3 border=1》
《frame src=“toc.html“ name=“myToc“ marginwidth=0 marginheight=0》
《frame src=“content.html“ name=“myContent“》
《/frameset》
《noframes》
《/noframes》
《/html》
html框架，为什么左边的导航栏，一定在右边显示为什么不在上面框架显示什么原理！！紧急，谢谢啦
这个你想在哪里显示就在哪里显示，有一个属性叫 target=“rightFrame“，这个rightFrame就是右侧框架的名字，当然你也可以改成别的。对应的框架name也必须个target保持一致。
html如何实现pc端导航栏在顶部手机端导航栏在左侧
需要借助z-inde来指定叠放次序，z-index值高，block居于顶部，因此将导航栏的z-index设置为2，侧边栏的z-index设置为1。
先简单说一下原理，我们需要用到css中position:fixed这一属性，在默认状态下，当不指定block的相对居中位置时，它会自动居于浏览器左侧，并且固定在此。因此，我们需要将导航栏的长度拉伸到100%，并且给予一个高度，在我的界面中，其高度为50px(我的网页并不是直接指定，而是通过padding以及字的高度填充，这里进行简化)。同理，对于侧边栏同样可以使用position:fixed这一属性来固定。同时设置一个固定长度350px，其高度设为100%。由于设置这一属性会破坏页面的流式结构，两个block会出现重叠的现象。因此，需要借助z-inde来指定叠放次序，z-index值高，block居于顶部，因此将导航栏的z-index设置为2，侧边栏的z-index设置为1。 所以此时，内容模块必须相对于浏览器的左侧与顶部做一定的空位，否则会被挡住。
综上，CSS可以写成下面这样。
html左导航菜单拉伸,右边文章也跟着变怎么解决
《style》
#D1 {
BACKGROUND-COLOR: lightgreen;
BORDER-BOTTOM: white 2px outset;
BORDER-LEFT: white 2px outset;
BORDER-RIGHT: white 2px outset;
BORDER-TOP: white 2px outset;
LEFT: 0px; POSITION: absolute;
TOP: 0px; VISIBILITY: hidden;
WIDTH: 300px;
layer-background-color: lightgreen
}
a{font-size:9pt}
a:link{text-decoration:none}
a:hover{text-decoration:none;color:#FFFFFF}
a:visited{text-decoration:none}
.40pt{font-size:40pt;color:#3399ff;font-family:文鼎琥珀繁}
《/style》
《script language=“javascript“》
function menuIn() //菜单隐藏
{
if(n4) {
clearTimeout(out_ID)
if( menu.top 》 menuH*-1+20+10 ) {
menu.top -= 8
in_ID = setTimeout(“menuIn()“, 1)
}
else if( menu.top 》 menuH*-1+20 ) {
menu.top--
in_ID = setTimeout(“menuIn()“, 1)
}
}
else {
clearTimeout(out_ID)
if( menu.pixelTop 》 menuH*-1+20+10 ) {
menu.pixelTop -= 8
in_ID = setTimeout(“menuIn()“, 1)
}
else if( menu.pixelTop 》 menuH*-1+20 ) {
menu.pixelTop--
in_ID = setTimeout(“menuIn()“, 1)
}
}
}
function menuOut() //菜单显示
{
if(n4) {
clearTimeout(in_ID)
if( menu.top 《 -10) {
menu.top += 4
out_ID = setTimeout(“menuOut()“, 1)
}
else if( menu.top 《 0) {
menu.top++
out_ID = setTimeout(“menuOut()“, 1)
}
}
else {
clearTimeout(in_ID)
if( menu.pixelTop 《 -10) {
menu.pixelTop += 2
out_ID = setTimeout(“menuOut()“, 1)
}
else if( menu.pixelTop 《 0 ) {
menu.pixelTop++
out_ID = setTimeout(“menuOut()“, 1)
}
}
}
function fireOver() {
clearTimeout(F_out)
F_over = setTimeout(“menuOut()“, 10)
}
function fireOut() {
clearTimeout(F_over)
F_out = setTimeout(“menuIn()“, 10)
}
function init() {
if(n4) {
menu = document.D1
menuH = menu.document.height
menu.top = menu.document.height*-1+20
menu.onmouseover = menuOut
menu.onmouseout = menuIn
menu.visibility = “visible“
}
else if(e4) {
menu = D1.style
menuH = D1.offsetHeight
D1.style.pixelTop = D1.offsetHeight*-1+20
D1.onmouseover = fireOver
D1.onmouseout = fireOut
D1.style.visibility = “visible“
}
}
F_over=F_out=in_ID=out_ID=null
n4 = (document.layers)?1:0
e4 = (document.all)?1:0;
《/script》
《div id=“D1“》
《table border=“0“ width=“294“》
《TBODY》
《tr》
《td align=“middle“ bgColor=“#008000“ rowSpan=“2“ width=“14“》《font color=“#FFFFFF“》
导
航
菜
单《/font》《/td》
《td width=“127“》 《ul》
《li》《a href=“javascript:void(0)“》站长特效网《/a》《/li》
《li》《a href=“javascript:void(0)“》网站首页《/a》《/li》
《li》《a href=“javascript:void(0)“》zzjs《/a》《/li》
《li》《a href=“javascript:void(0)“》网页特效《/a》《/li》
《li》《a href=“javascript:void(0)“》站长特效《/a》《/li》
《/ul》
《/td》
《td width=“133“》
《/td》
《/tr》
《/TBODY》
《/table》
《/div》
《body onload=“init()“ 》
《/body》
HTML编写左侧导航栏 要求如下图
《ul》
《li class=bj》 《/li》
《li》 《li》
《/ul》
