❶ 怎麼用html+css做一個導航條

首先建抄立一個DIV，為其命名為襲「nav」，在DIV中建立一個<ul>無序列表，導航共有幾個欄目，就為列表添加幾個<li>的列表項，為每個列表項中的內容加上超鏈接，鏈接到所需的項目頁面。

然後設置CSS樣式，為列表規定寬度和高度，去掉列表前面的符號，代碼為：
ul {width:寬度值；height：高度值； list-style:none；}

如果是橫向導航，還需為裡面的列表項<li>標簽設置左浮動的樣式，代碼為：li {float:left;}

每個欄目之間分隔的距離可通過margin（外邊距）屬性來設置。

導航條的更多樣式及詳細步驟可去這里參考http://jingyan..com/article/da1091fb05fe93027849d600.html

❷ 如何製作MetInfo導航條

一、全面了解網站模板的類別，定位自己想要製作的網站模版的風格和模塊，包括頭部，身體，尾部的內容，圖片，顏色等！
二、需要掌握的基本語言
1.HTML：熟練，HTML教程；
2.CSS：熟練， CSS教程；
3.javaScript（簡稱JS）：簡單製作模板不需要掌握太多JS，知道JS有什麼作用即可，JS教程；
4.PHP：不需要掌握太多PHP，了解基本的語法知識即可，PHP教程；
註：這幾種語言是網站製作人員必須了解和熟知的！
三、需要具備的工具
1.推薦使用瀏覽器：谷歌瀏覽器，支持HTML+CSS3，前端開發必備。
2.推薦Web瀏覽器調試工具：IETester 多個IE版本，用於測試IE兼容。
3.推薦代碼編輯器：notepad++ 非常棒的輕量級代碼編輯器，推薦它主要是比 Dreamweaver 快太多。
4.推薦圖片處理軟體：PhotoShop 圖像處理軟體，簡稱PS。
註：上面推薦的工具僅作參考！個人可以根據喜好選擇自己習慣的工具！
四、環境搭建，製作網站模板！
要製作網站模板，就必須搭建並運行所需要的環境以及安裝想製作的模板系統，以便在自己的電腦上進行製作和測試。
五、MetInfo網站模板製作相關教程

❸ 網頁製作的導航條問題

不知道你會使用抄DW么？ DW中可以實現的

1.首先插入一個表格（必須要兩行，列數隨意）
2.選中第二行的某個單元格----插入一個層
3.選中層————在層內在插入一個表格（你想要下拉菜單顯示多少行就選多少行）
4.添加行為————顯示/隱藏層。

大致步驟就這么多，希望對你有幫助。。

❹ 如何使用Dreamweaver做一個網頁的導航欄

Dreamweaver，簡稱「DW」，中文名稱"夢想編織者"，是美國MACROMEDIA公司開發的集網頁製作和管理網站於一身的所見即所得網頁編輯器。
想用DW做出導航欄必熟知div+css，基本代碼：
ul#nav{ width:100%; height:60px; background:#00A2CA;margin:0 auto}
ul#nav li{display:inline; height:60px}
ul#nav li a{display:inline-block; padding:0 20px; height:60px; line-height:60px;
color:#FFF; font-family:"\5FAE\8F6F\96C5\9ED1"; font-size:16px}
ul#nav li a:hover{background:#0095BB}/*設置滑鼠滑過或懸停時變化的背景顏色*/

<ul id="nav">
<li><a href="#">首頁</a></li>
<li><a href="#">HTML教程</a></li>
<li><a href="#">CSS基礎</a></li>
<li><a href="#">CSS開發工具</a></li>
<li><a href="#">CSS特效</a></li>
<li><a href="#">CSS問題</a></li>
</ul>

❺ 網頁導航條怎麼做

可以用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)

❻ 請問各大門戶網站首頁的圖片導航條怎樣製作

你看看是不是跟這個一樣的: http://www.ihaiyang.com

將下面代碼放在你的網頁上
<script src="AlterImage.js"></script>
<div id="sx6781"></div>

<script type="text/javascript">
function loadAlterImage(){

var alterImage=new AlterImage({width:250,imageHeight:172});
alterImage.showText=1;

var item1=new AlterImageItem();
item1.image='http://www.ihaiyang.com/haiyang10.jpg ';
item1.link='http://bbs.qiyeclub.net/haifeng/ShowPost.asp?ThreadID=2876';
item1.text='今年煙台月月都有大型專場招聘會';
alterImage.add(item1);

var item2=new AlterImageItem();
item2.image='http://www.ihaiyang.com/haiyang11.jpg';
item2.link='http://bbs.qiyeclub.net/haifeng/ShowPost.asp?ThreadID=2827';
item2.text='找工作：文科與理科，就業冰火兩重天？';
alterImage.add(item2);

var item3=new AlterImageItem();
item3.image='http://www.ihaiyang.com/haiyang7.jpg';
item3.link='http://bbs.qiyeclub.net/haifeng/ShowPost.asp?ThreadID=2470';
item3.text='海陽大秧歌傳承人上榜國家非遺傳人';
alterImage.add(item3);

var item4=new AlterImageItem();
item4.image='http://www.ihaiyang.com/haiyang4.jpg';
item4.link='http://bbs.qiyeclub.net/haifeng/ShowPost.asp?ThreadID=2211';
item4.text='山東高考:大中專院校錄取新生不遷戶口';
alterImage.add(item4);

var item5=new AlterImageItem();
item5.image='http://www.ihaiyang.com/haiyang9.jpg';
item5.link='http://bbs.qiyeclub.net/haifeng/ShowPost.asp?ThreadID=2867';
item5.text='美刊大肆狂想：中美太空大戰';
alterImage.add(item5);

alterImage.fill('sx6781');
}

loadAlterImage();

</script>
將下面兩個文件下載到你的空間與網頁在同一目錄下:
http://www.ihaiyang.com/AlterImage.js
http://www.ihaiyang.com/viewpic.swf

你還可以修圖片大小,同樣也要修改代碼的值,你可以增加或者減少圖片的數量.

❼ 請問網站導航欄怎麼做方便修改，製作一次多頁面使用

做成自定義控制項啊
不懂就去找找教程

❽ 如何用Photoshop製作網站的「導航欄」

網站的「導抄航欄」作為網頁設計中的重要組成部分，扮演著極為重要的角色。網頁導航欄設計的成功與否，在很大程序上決定著整個網頁的美觀程度。用Photoshop設計「導航欄」，不僅講究ps技術，更在於發揮你的創造力和想像力，這是學習ps最難之所在。具體製作過程見網上教程。

❾ 如何實現製作的網頁左側能有一個跟著網頁移動的導航欄，就像那種廣告一樣

把你的導航欄添加一個position:fixed的css屬性就行了，有可能會被其他層蓋住，可以再增加z-index屬性。

❿ 如何用PPT製作網站導航欄

PPT教程一、首先畫一個矩形框，設置其大小為：高6.2厘米，寬5.2厘米。
PPT教程二、再畫一個矩形框，設置其大小為：高6厘米，寬5厘米。
PPT教程三、把它們的頂邊、左邊重合在一起，再進行組合，這樣兩個對象就變成一個對象。
具體步驟如下：把小一點的矩形框放在大的矩形框上面，直接拖動小的到大的上面即可。或者採用如下辦法：設置大的矩形框的位置為：水平：1厘米，垂直：2厘米，小的也是同樣的位置，這樣它們就重合。
選中大的矩形框(下面的那個)，按住Shift鍵不放開，再單擊小的矩形框，然後右擊->組合
PPT教程四、再畫一個矩形框，高：1.2厘米，寬：5.8厘米，位置：水平：0.65厘米，垂直：0.8厘米。
右擊該矩形框，選擇「添加文字」，輸入「菜單」兩字。
PPT教程五、添加菜單項
1、再畫一個矩形框，大小：高：1.2，寬：5，位置：水平：1，垂直：2，添加文字為「設計思維」
2、重復1，改位置為：水平：1，垂直：3.2，添加文字「色彩設計」。
3、再畫三個同樣的矩形框，只是按照上面步驟更改位置和文本，不再鰲述。
PPT教程六、設置進入動畫
右擊選中剛剛創建的對象，選擇「自定義動畫」，出現「自定義動畫」的任務窗格(只有PPT 2003以上的版本才有，2000版以下的可以休息了，不支持啊)，選擇組合框(兩個大的矩形框，已經組合在一起成為一個對象)，單擊「添加效果」->「進入」->「其它效果」，選擇「切入」，確定返回。更改切入方向的為「自頂部」(只要在任務窗格中單擊「方向」的下拉箭頭進行選擇即可)。
設置觸發器，在任務窗格下方出現第一個動畫對象，單擊它(選中)，然後在它的右邊單擊下拉箭頭，選擇「計時」，出現一個對話框。單擊「觸發器」的按鈕，選擇下面的一個「單選按鈕」，再單擊它右邊的下拉箭頭選擇「矩形框5：菜單」，確定返回即可。
一個組合框的觸發器下拉動畫完成了。
下面進行其它的對象觸發器下拉動畫設置：
選中「設計思維」矩形框，按照上面的步驟進行重復的設置，只修改如下部分：
在設置完成後，「設計思維」的動畫是「單擊」才能進行的，因此，需要修改。在任務窗格中選中「設計思維」動畫，然後單擊它右邊的下拉箭頭，選擇「從上一項之後開始」命令(或者直接單擊任務窗格上部的「開始」下拉箭頭，選擇「之後」，下同)。
上面完成了「設計思維」的下拉動畫設置
再選擇「色彩設計」矩形框，添加下拉動畫，其設置與「設計思維」相同，但是要改「單擊」為「之前」，其含義是：讓「設計思維」與「色彩設計」的動畫同時進行。
後面的菜單項與「色彩設計」完全相同。
PPT教程七、設置退出動畫
其設置過程與六基本相同，
首先選擇「組合框」，單擊「添加效果」->選擇「退出」命令(注意，六是選擇「進入」，這里是選擇「退出」)，然後選擇「退出動畫」中的「切出」，設置其觸發器為「矩形框5：菜單」，也就是和上面的相同。動畫方向為「到頂部」，開始為「單擊」，再選擇「設計思維」矩形框，添加「退出」動畫效果，觸發器還是「矩形框5：菜單」，把「單擊」改為「之後」，而其它的菜單項都設置為「之前」，設置方法同六。
PPT教程八、添加多張幻燈片
按下Ctrl + M 4次，添加4張幻燈片，在每一張上添加適當的文字。
選擇剛剛弄成包含有的菜單幻燈片(也就是第一張)，選中「設計思維」矩形框對象，單擊「幻燈片放映」，選擇「動作設置」命令，超鏈接到第一張幻燈片，同理，其它每一個菜單對象都超連接到對應的幻燈片上。
然後選中第一張做好動畫菜單的所有對象，復制粘貼到所有的幻燈片上，至此大功告成。