ホーム・ページと2019.12.5-例（ブロックレイアウト要素内の行を使用して）コード

<！DOCTYPE HTML>
<HTML LANG = "EN">
<HEAD>
<METAのcharset = "UTF-8">
<タイトル>ページの例</ TITLE>
</ HEAD>
<スタイルタイプ= "テキスト/ CSS">
{.menu
幅：958px;
高さ：40ピクセル;
ボーダー：000 1ピクセル固体＃;
マージン：は50px自動0;
パディング：0;
リストスタイル：なし; / *ポイント* /の正面除去
テキストALIGN =左：センター; / *ヘッダセンタリング* /
行の高さ：40ピクセル; / *垂直中心* /
フォントサイズ：0;
}

李{.menu
表示：インラインブロック; / *行ブロック要素* /に変換
フォントサイズ：14px;
}

.menu .LINE {
色：＃333。
マージン：0 20ピクセル;
}

{李.menu
フォントファミリ：「微軟雅黒」;
色：＃333;
テキスト装飾：なし; / *削除下線* /
}

.menuリチウムのA：ホバー{
色：赤。
}

.pagenation {
幅：958px;
高さ：40ピクセル;
国境：1pxの固体＃000;
マージン：は50pxオート0;
フォントサイズ：0;
テキスト整列：センター;
}

{.pagenation
ディスプレイ：インラインブロック; / *转换成行内块元素* /
パディング：5pxの10pxの;
背景色：金;
フォントサイズ：12ピクセル;
フォントファミリ：「微軟雅黒」;
テキスト装飾：なし;
マージン：8px 5pxの;
色：＃333;
}

ホバー{：.pagenation
背景色を赤。
色：#FFF;

}

.pagenationスパン{
表示：インラインブロック。
フォントサイズ：12ピクセル;
}

</スタイル>
<身体>

<ULクラス= "メニュー">
<LI> <a href="">首页する</a>ます。</ li> <！ -用リチウム做、搜索引擎收录好点- >
<LIクラス= "行"> | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
<LIクラス="行"> | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
<LIクラス= "行"> | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
<LIクラス= "ライン" > | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
<LIクラス= "行"> | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
<LIクラス= "行"> | </ LI>
<LI> <a href="">网站建设する</a>ます。</ li>
</ ulの>

</ BODY>
</ HTML>

ホーム・ページと2019.12.5-例（ブロックレイアウト要素内の行を使用して）コード

おすすめ