網頁設計[顯示網站資訊的導航及如何用CSS來控製圖片大小]

 

指令碼說明:
第一步:把如下代碼加入〈head>地區中

 

<SCRIPT language=javascript>
〈!--function linkDisplay(selection)
{ 
if(selection=="1")
{
document.form.info.value="凡是首頁製作需要的圖片資料,這裡都有。";
document.form.go.value="time1.htm";
}
else if(selection=="2")
{
document.form.info.value="流行軟體和註冊機碼下載，軟體分類齊全！";
document.form.go.value="time2.htm";
}//連結自己可以加入，說明也可以更改！else if(selection=="3"){
document.form.info.value="首頁製作密技奉獻，正在學習和製作首頁的朋友在這裡一定能發現有用的資料。";
document.form.go.value="3.htm";
}else if(selection=="4")
{
document.form.info.value="大量的中外影視明星美女的劇照和寫真，詹姆斯邦
德，施瓦辛格，第五元素，哈裡森福特，周潤發,泰坦尼克，蝙蝠俠，變臉及X-檔案等劇照。蘇慧倫，王菲，酒井法子，朱茵等美女桌布！";
document.form.go.value="4.htm";
}
else if(selection=="5")
{
document.form.info.value="幾千個註冊機碼等著你呢！而且在不斷地添加新的東西";document.form.go.value="5.htm";
}
else if(selection=="6")
{
document.form.info.value="MIDI音樂屋當然是最首歡迎的MIDI樂曲下載天地了，中外流行曲，美國鄉遙，影視主題曲";
document.form.go.value="6.htm";
}
}
function moreInfo()
{
var page=document.form.go.value;window.location=page;
}//--
</SCRIPT>

 

第二步:把如下代碼加入地區中

<form name=form>
<input type=hidden name=go value>
<table border=0 width=300> 
<tr> 
<td align=center width=111><a href=javascript:linkDisplay(1);>網頁圖片庫</a><br> </td>
<td align=center width=123><a href=javascript:linkDisplay(2);>軟體下載倉庫</a><br> </td> 
<td align=center width=160><a href=javascript:linkDisplay(3);>首頁製作密技</a><br> </td> 
</tr> 
<tr> 
<td align=center width=111><a href=javascript:linkDisplay(4);>美女明星寫真<br> </a></td> 
<td align=center width=123><a href=javascript:linkDisplay(5);>註冊機碼集中營</a><br> </td> 
<td align=center width=160><a href=javascript:linkDisplay(6);>MIDI音樂屋</a><br> </td>
</tr>
<tr> 
<td colspan=3 align=center width=402>
<div align=center><p><textarea name=info rows=5 cols=34 wrap=virtual>點擊串連看個仔細</textarea>
<br> <input type=button name=button value=去看看 onClick=moreInfo()> </td> 
</tr> 
</table>
</form>

 

如何用CSS來控製圖片大小，圖片太大的時候尤其是在一些CMS管理系統上，會出現網頁被撐破，網頁被撐開的局面，調整這一方法可以根據CSS來實現，下面為代碼執行個體：

 

img,a img
{ 
border:0;  
margin:0;  
padding:0; 
max-width:590px; 
width:expression(this.width>590?"590px":this.width); 
max-height:590px; 
height:expression(this.height>590?"590px":this.height); 
} 

這樣當我們的圖片寬度超過590的時候，就對應的百分比縮小！