Question

我遇到过一个我一直在努力的网站的问题。老实说，我可能采取了一种完全错误的方法来实现这一目标。

我想要的是我的菜单有五个图像而不是按钮。按钮大小为200像素×150像素。我将所有图像放在一个带有html a href和img标签的div中，以实现这一点。它看起来很好，直到你的页面不是至少~1000px宽。它会将最后一张图像击倒。您可以在此处查看：http://travisbrassfield.com/。我仍然是一个初级网络开发人员，并决定为朋友建立一个网站，我出于某些原因使用了wordpress，我对此并不满意，但现在回去已经为时已晚，因为其他一切都已完成。

我已经玩了一些CSS，而HTML，我将提供以下代码。它可能都是非常错误的，我只是因为它没有工作而变得脾气暴躁，并且尝试了我在这里和那里发现的随机代码片段，看看是否有什么可行，因为我已经厌倦了它。任何帮助将不胜感激。

HTML：

<div class="navigationbar2">
<a href="../index.php"><img src="../img/homeMENU.png" alt="aa" width="200"     height="150"></a>
<a href="../store-offline/"><img src="../img/storeMENU1.png" alt="aa" width="200" height="150"></a>
<a href="../art/"><img src="../img/artMENU.png" alt="aa" width="200" height="150"></a>
<a href="../photos"><img src="../img/photosMENU.png" alt="aa" width="200" height="150"></a>
<a href="../sketches/"><img src="../img/SKETCHmenu.png" alt="aa" width="200" height="150"></a>
<a href="../about/"><img src="../img/aboutMENU.png" alt="aa" width="200" height="150"></a>
</div>

CSS：

.navigationbar2 {
    f
    margin:auto;
    max-height:200px;
    max-width:1600px;
.navigationbar2 img {
    float:left;
    min-width:50%
    min-height:50%
    max-height:100%;
    max-width:100%;
}

Answer 1

每个菜单项图片的最大宽度必须为200px ...最大宽度为150px，以确保它们出现在~1000px的同一行

菜单栏中的图像按钮，如何缩放到页面宽度

1 个答案: