ホームページ > 記事 > ウェブフロントエンド > 独自のナビゲーション ページを作成して、今すぐ行動してください。 _html/css_WEB-ITnose
誰もがナビゲーション サイトを使用したことがあると思いますが、私も例外ではありません。しかし、ある日突然、自分でナビゲーションを作ってみようかと思いました。以前はローカル API やオンライン API がたくさんあり、それらを使用するたびに見つけるのに時間がかかりました。今では、小さなナビゲーションを構築しました。一目でわかるページですね(笑)!
これは私のナビゲーション ページのソース コードです。心からの贈り物です:
< html xmlns = "http://www.w3.org/1999/xhtml" >
< head >
< メタ http-equiv = "コンテンツ タイプ" コンテンツ = "text/html; charset=GB2312"
<マイ ホームページ タイトル > / css" >
.main {
margin-top: 50px;
background-color: #D9FF99;
.title {
font-size: 40px;
color: #CC6633;
フォント- ファミリー: "Hanzhen Guangbiao"、"Youyuan"、"Microsoft Yahei"、サンセリフ;
text-shadow: 2px 2px 2px rgba(200, 200, 200, 0.5); : ブロック;
幅: 960px;
マージン: 0;
.content li {
;
幅: 192 ピクセル;
高さ: 100 ピクセル;
テキスト整列: 中央;
フォント サイズ: 24 ピクセル;
.content li a {表示: ブロック;
高さ: 60 ピクセル;
テキスト整列: 中央;
背景-色: 緑;
マージン: 18px 25px;
.content li a:hover {
< ;/ スタイル >
ヘッド >
< テーブル幅 = "960" セルスペース = "0" クラス = "メイン"整列 = "中央"
<
<テーブル幅 = "960" ボーダー = "0" セルスペース = "0" セルパディング = "0" >
< tr>
< td 幅 = "382" >< img
src = "http://images.cnitblog.com/blog/343602/201310/28113106-18da6293d7a44fed97ce8b1dadaa6c30.jpg"
width = " 382" 高さ = "101" 境界線 = "0" />< /td>
< td width = "578" align = "center" bgcolor = "#D5EDB3" >< span class = "title" >我 的 主 页
tr >
テーブル>
td >
tr >
< tr 高さ = "10" >
< td bgcolor = "#004000" > > td >
tr >
< tr>
< td class = "コンテンツ" >
<ウル>
td >
tr >
テーブル>
ボディ>