html - 调整浏览器窗口大小时

Question

我用 HTML 和 CSS 构建了一个网站，每当我调整浏览器窗口的大小时(变小)，它就会弄乱网站的组件，例如导航栏。导航栏是使用 <img src= 链接到目的地的一系列图像。 .知道如何解决这个烦人的事情吗？

导航栏的代码如下:

<br />
<div id="nav"> 
   <a href="/"><img src="Home.png" /></a> </a>
 <a href="/blog"><img src="=blog.png" /></a> </a>
 <a href="register.php"><img src="adopt.png" /></a> </a>
 <a href="user.php"><img src="useradmin.png" /></a> </a>
 <!-- <a href="login.php"><img src="\logout.png" /></a> </a> -->
 <a href ="places.php"><img src="map.png"/></a> </a>
  <a href ="login.php?logout"><img src="logout.png"/></a> </a>
 <!--- <a href ="login.php"><img src="q.png"/></a> </a> -->
</div>

谢谢。

Answer 1

您应该在样式表中为菜单容器 (#nav) 指定一个宽度，如下所示:

#nav { 
width: 500px;
 } 

这样，您的菜单将永远不会缩小到指定大小以下，并且布局(在本例中为菜单)也不会中断。

话虽如此，您的链接中也应该有文本，并使用一些image replacement technique。将链接显示为图像/图形。

您的代码中也有语法错误；你关闭所有 anchor 元素两次。