0

我正在制作一个游戏网站，并且我正在使用 DIV 标签作为类型菜单。在制作菜单时，我发现我无法为菜单设置 DIV 元素的大小。如果这很重要，我正在使用。HTML：

    <div class="center">
     <div class="menu" onclick="location.href='all.html';">All</div>
     <div class="menu" onclick="location.href='action.html';">Action</div>
     <div class="menu" onclick="location.href='arcade.html';">Arcade</div>
     <div class="menu" onclick="location.href='racing.html';">Racing</div>
     <div class="menu" onclick="location.href='rpg.html';">PRG</div>
     <div class="menu" onclick="location.href='skill.html';">Skill</div>
    </div>
    <div class="center">
     <div class="menu" onclick="location.href='strategy.html';">Strategy/Puzzle</div>
     <div class="menu" onclick="location.href='shooting.html';">Shooting</div>
     <div class="menu" onclick="location.href='sports.html';">Sports</div>
     <div class="menu" onclick="location.href='gamegarage.html';">GameGarage</div>
    </div>

CSS：

    body
    {
    background-color:black;
    color:rgb(0,255,0);
    font-family:"Comic Sans MS";
    font-weight:bold;
    }
    .center
    {
    text-align:center;
    }
    .menu
    {
    font-size:1.35em;
    display:inline;
    width:250px;
    cursor:pointer;cursor:hand;
    border:5px solid #00FF00;
    }
    div
    {
    margin-bottom:15px;
    }

有谁知道我做错了什么？感谢所有的帮助！

4

3 回答 3

0

尝试将您的菜单标签的 CSS 更改为：

.center .menu
{
font-size:1.35em;
display:inline-block;
width:250px;
cursor:pointer;cursor:hand;
border:5px solid #00FF00;
}

您也应该将 onclick 事件更改为window.location.href = "link"

于 2012-07-20T21:04:11.327 回答
0

利用

display:block

或者

display:inline-block

而不是在您的菜单类中内联。

于 2012-07-20T21:04:27.880 回答
0

要固定 div 的宽度，您需要设置

.menu {
    display: inline-block;

现在您可以定义 div 的宽度、高度和垂直对齐。

    width: 250px; height: 1.4em; /* height: auto inherit 130px */
    vertical-align: middle;
}

如果您有一个外框“.center”，它是装箱或内联装箱的，但会比 .menu 高得多，它将在外“.center”框的中间对齐。

于 2012-07-20T21:21:10.360 回答