DIV CSS 佈局教程網

設為首頁 加入收藏
 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> 3D按鈕式導航條
3D按鈕式導航條
編輯：CSS詳解     

<Html>
<head>
<title>3D按鈕式導航條</title>
<meta http-equiv="Content-Type" content="text/Html; charset=gb2312">
<style>
body{text-align:center;background:#ffffff}
.up{
border:3 outset royalblue;color:yellow;font:12px;text-align:center;background:blue;cursor:hand
}
.down{
border:3 inset royalblue;color:#33ff33;font:12px;text-align:center;background:blue;cursor:hand;position: relative; left: 1px; top: 1px; clip:rect( )
}
</style>
</head>
<body>
<table width="700" border="0" cellspacing="2" cellpadding="0">
<tr>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" onclick=window.open("http://www.knowsky.com","_blank") cellpadding="0" cellspacing="0">
<tr>
<td>資訊中心</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>技術天地</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>軟件特供</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT財經</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>市場專家</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>互動學校</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>DIY專區</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>媒體全文</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT羅盤</td>
</tr>
</table>
</td>
<td width="10%">
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT人才</td>
</tr>
</table>
</td>
</tr>
</table>

　　<p>&nbsp;</p>
<table width="70" border="0" cellpadding="0" cellspacing="2">
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" onClick=window.open("http://www.knowsky.com","_blank") cellpadding="0" cellspacing="0">
<tr>
<td>資訊中心</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>技術天地</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>軟件特供</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT財經</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>市場專家</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>互動學校</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
&lt;td>DIY專區</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>媒體全文</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT羅盤</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="0" height="100%" class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouSEOut="className='up'" cellpadding="0" cellspacing="0">
<tr>
<td>IT人才</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</Html>

CSS詳解
CSS模塊化的理解
我沒有看過CSS模塊化的相關書籍，所以我下面說的不一定正確，但是在工作中，我會用我理解的模塊化方式
Div CSS實例教程：頁面制作方法全程指導(3)
四、Div CSS實例之列表和數據塊 模塊的主體是由列表組成的，而列表裡則包含數據塊。按我的理解，
CSS計數器counter()的用法簡介
這篇文章主要介紹了CSS計數器counter()的用法,是CSS入門學習中的基礎知識,需要的朋友可

相關文章

CSS基礎知識Sass教程CSS3基礎關於CSSCSS進階教程DIV十CSS布局CSS特效代碼CSS詳解
小編推薦
CSS3實例教程:使用border CSS border常見簡寫屬性 網頁顏色的幾種表示 解析CSS中list-style-image屬性的使用 CSS框架的利與弊 鼠標經過文字變色 CSS實用教程（三）[圖] 網頁設計經驗和技巧總結 兩句CSS完美截斷側欄最新評論列表 布局關於分辨率與100%自適應問題
熱門推薦
用css來控制圖片大小顯示的實現方法與代碼 用CSS濾鏡打開圖片的各種效果,很有用 CSS:*DIV+CSS標准網頁菜單代碼(3) IE和Firefox下編寫Javascript的區別(6) css解決英文字符與阿位伯數字自動換行 將XHTML+CSS頁面轉換為打印機頁面技巧(1) 21個好玩、有趣味、實驗性的css技術運用實例 媒體查詢與http請求 CSS中慎用中文注釋
大家都在看
Firefox與IE下UL預設標記的異同 浏覽器與互聯網技術的演變 互聯網信息設計准則:訪客如何閱讀和理解信息 關於jQuery object and DOM element 網頁申請表單用戶體驗設計 怎樣設計網頁？怎樣制作網頁？ JavaScript彈出新窗口並控制窗口移動到指定位置的方法 IE7下position:relative的問題
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved