0

ページの上部にいくつかのナビゲーション リンクがあり、画面の中央に配置するのに問題があります。CSSのどこが間違っているのか、誰かが提案できますか?

画像: http://i.imgur.com/SUTWr.png

CSSは次のとおりです。

#nav {
list-style-type:none;
text-align:center
}

ul li {
display:inline-block;
border-radius:10px;
background:#EEE;
margin:5px;
}

li a {
float:left;
padding:30px;
text-decoration:none;
color:black;
text-shadow: 1px 1px #DDD;
border-radius:10px;
box-shadow:3px 3px black;
}

li a:hover {
background:#CCC;
color:#333;
}

li a:active {
background:#555;
color:white;
text-shadow: 1px 1px #000;
}

ありがとう

4

3 に答える 3

1

こんにちは、実際に私はあなたのcssを更新しました。これがうまくいくことを願っています:-

デモ

CSS

#nav {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
     box-sizing: border-box;
    background: none repeat scroll 0 0 #B8B8B8;
    height: 400px;
    list-style-type: none;
    margin: auto;
    padding: 40px 0;
    width: 400px;
}

ul li {
display:inline;

}

li a {
text-decoration:none;
color:black;
text-shadow: 1px 1px #DDD;
border-radius:10px;
background:#EEE;
margin:5px;
padding:30px;
box-shadow:3px 3px black;
}

li a:hover {
background:#CCC;
color:#333;
}

li a:active {
background:#555;
color:white;
text-shadow: 1px 1px #000;
}
于 2012-11-21T10:23:41.367 に答える
0

これらのタグを .<ul>で囲んでみてください<div style="margin-left: auto; margin-right: auto">。
このようにして、すべての<ul>タグを一度に中央揃えにします。

写真の「1,2,3,4,5」が ul 要素で、#nav が周囲の div の ID である場合margin-left: auto; margin-right: auto、スタイルシートで #nav に追加するだけです。

于 2012-11-21T10:19:58.807 に答える