網頁設計導航欄怎麼水平_求高手！製作網頁時我的導航條是水平的如何改為垂直的

1、css html製作網頁，用ul和li製作橫向導航欄

將ul裡面的li標簽都設置為右浮動即可。如：

2、網頁導航條怎麼做?

可以用div+css做的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
body { background-color:#000000;}
#nav { height:30px; list-style:none;}
#nav li { float:left;}
#nav li a { color:#fff; text-decoration:none; padding-top:4px; display:block; width:118px; line-height:22px; height:24px; text-align:center; background:url(/uploadfile/200806/17/66191858519.gif); margin-left:5px; font-size:14px; font-weight:bold;}
#nav li a:hover { background:url(/uploadfile/200806/17/66191858519.gif) left -42px; color:#ffffff;}
#nav li a#current { background:url(/uploadfile/200806/17/66191858519.gif) left -84px; color:#fff;}
</style>
</head>
<body>
<ul id="nav">
<li><a href="/index.asp">主頁</a></li>
<li><a id="current" href="/Sort/List_4.html">DIV+CSS教程</a></li>
<li><a href="/Sort/List_5.html">常用代碼</a></li>
<li><a href="/Sort/List_6.html">水晶圖標</a></li>
<li><a href="/Sort/List_7.html">幻燈圖片</a></li>
<li><a href="/Sort/List_10.html">軟體下載</a></li>
<li><a href="/css2/">CSS2.0實用手冊</a></li>
</ul>
</body>
</html>
文章出處：標准之路(http://www.aa25.cn/div_css/289.shtml)

3、用CS5設計網頁，導航條Div在設計窗口顯示縱向，預覽網頁，導航條自動變成橫向的，怎麼設置的呢

這個很簡單，用js才能實現，css樣式我就不說了，左側是a鏈接，右側是div，

關鍵是js，在每個點擊里添加onclick事件，事件觸發opens函數，函數通過參數判斷要打開哪個div，其餘的再隱藏，給個例子你，很簡單的東西，我隨便寫的，沒有測試過，你自己研究研究：

<a href="#" onclick="opens(1)">1</a>

<a href="#" onclick="opens(2)">1</a>

<a href="#" onclick="opens(3)">1</a>

<div id="dis1">111</div>

<div id="dis2" style="display:none">222</div>

<div id="dis3" style="display:none">333</div>

<script>

function opens(obj){

for(var i = 1;i<=3;i++){

if(i == obj){document.getElementById("dis"+i).style.display="block"

}else

document.getElementById("dis"+i).style.display="none"

}

}

</script>

4、網頁設計怎樣使橫向導航欄文字居中

沒有居中可能是因為你把a標簽放到盒子里了（應該是div或者li吧），然後沒有給出盒子的寬度，於是寬度自適應為文字寬度加padding，所以textalign沒效果。吧寬度改下在看看吧，希望對你有幫助

5、網頁設計導航是怎麼做的

1、打開Deamweaver8，新建一網頁文件。接著輸入以下導航菜單的內容：

<head>

<title>導航欄示例</title>

</head>

<body>

</ul>

</body>

</html>

2、此時對應效果如圖：

3、接下來准備相關的導航按鈕圖片（可以事先利用PS製作好）。

4、然後將以下CSS代碼加入到<head></head>之間：

body {text-align:center;}

#navigation

{ list-style-type:none; height:auto;}

#navigation li { width:154px; height:60px; text-align:center;

float:left; padding-top:18px;font-size:20px; font-family:"微軟雅黑", "宋體", "隸書";

background-image:url(images/noactive.jpg);}

a {width:154px; height:72px;}

a:link { text-decoration:none; color:#FFFF00;}

a:visited { text-decoration:none; color:#FFFF00; }

#navigation li:hover { color:#CC0000; text-decoration:underline;

background-image:url(images/active.jpg);}

a:hover{ color:#CC0033;}

#left {background-image:url(images/left.jpg); width:22px;}

</style>

5、在加入CSS代碼之間，網頁此時的效果如圖：

6、求高手！製作網頁時我的導航條是水平的，如何改為垂直的？？

把定義水平的那個浮動樣式（float）去掉，就變成垂直的了！

7、關於網頁製作請問怎樣讓這張大圖片跟導航欄對齊？

就是默認圖片寬度跟你導航寬度調成一致，如果你導航也是100%的話，img{width:100%;margin:0 auto;}，圖片要做的夠寬

導航:首頁 > 萬維百科 > 網頁設計導航欄怎麼水平

網頁設計導航欄怎麼水平

與網頁設計導航欄怎麼水平相關的知識