这是我一直遇到的问题。我最近开始学习网络开发并开始制作自己的迷你游戏网站,但我的页脚和超链接图像遇到了问题,由于我是新手,尽管在网上寻找答案,但我无法弄清楚这个问题。
我遇到的问题是,当我将超链接图像添加到我希望游戏所在的页面时,页脚从页面底部移动到图像所在的位置,然后页脚本身变为超链接,使其成为游戏所在的页面之一的可点击链接, 我想将图像放在"推荐游戏"的旁边,游戏本身位于页面的中心。当我删除超链接图像时,此问题不再发生。任何反馈将不胜感激,谢谢。
.HTML
<aside1>
<div class="container">
<h1>Recommended Games</h1>
</div>
</aside1>
<aside1 id="boxes">
<div class="container">
<div class="box">
<a href="spaceinvader.html">
<img src="img/spaceinvader.jpg">
<h3>Space Invaders</h3>
</div>
<div class="box">
<a href="hangman.html">
<img src="img/hangman.jpg">
<h3>Hangman</h3>
</div>
<div class="box">
<a href="pacman.html">
<img src="img/pacman.jpg">
<h3>Pacman</h3>
</div>
</aside1>
<footer>
<p>ACI Games, Copyright © 2019</p>
</footer>
.CSS
aside1{
width:20%;
position:absolute;
top:212px;
bottom:60px;
left:0px;
border-left:6px solid;
border-right:6px solid;
border-color:aqua
}
aside1 h1{
color:white;
text-align:center;
}
footer{
position: absolute;
bottom:0;
width:100%;
height:60px;
background:aqua;
text-align:center;
color:white;
}
您需要关闭</a>
标签。
这是更新的小提琴:
<aside1>
<div class="container">
<h1>Recommended Games</h1>
</div>
</aside1>
<aside1 id="boxes">
<div class="container">
<div class="box">
<a href="spaceinvader.html">
<img src="img/spaceinvader.jpg"></a>
<h3>Space Invaders</h3>
</div>
<div class="box">
<a href="hangman.html">
<img src="img/hangman.jpg"></a>
<h3>Hangman</h3>
</div>
<div class="box">
<a href="pacman.html">
<img src="img/pacman.jpg"></a>
<h3>Pacman</h3>
</div>
</aside1>
<footer>
<p>ACI Games, Copyright © 2019</p>
</footer>