如何解决图片/文字超链接-HTML / CSS
我目前正在网站的页脚中创建超链接的社交媒体图标。这3张图片中的每张图片都是单独的,并且分别链接到不同的社交媒体。但是,页脚中图片下方的“版权”文本会自动超链接到链接,作为最后一张图片= Instagram。
如何取消链接该文本?正如我希望它只是显示文本而不是超链接
.Socials {
display: inline-block;
margin-left: auto;
margin-right: auto;
width: 30%;
}
#footer {
text-align: center;
background-color: #000000;
color: white;
font-family: 'Big Shoulders Stencil Text',cursive;
}
<div id="footer">
<div class="Socials">
<a href="https://www.facebook.com/studyatulster/">
<img id="Facebook" src="Facebook.png" alt="Facebook">
<a href="https://twitter.com/UlsterUni? ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor">
<img id="Twitter" src="Twitter.png" alt="Twitter">
<a href="https://www.instagram.com/ulsteruni/?hl=en">
<img id="Instagram" src="Instagram.png" alt="Instagram">
</div>
<p>Belfast Virtual Shopping Centre - Copyright 2020</p>
</div>
解决方法
使用</a>
关闭超链接。例如:
<a href="https://www.facebook.com/studyatulster/">
<img id="Facebook" src="Facebook.png" alt="Facebook">
</a>
否则,浏览器将尝试为您更正标记结构,并且可能无法始终正确猜测。
,您需要结束<a>
标签,以使“链接”不再继续。
<div id="footer">
<div class="Socials">
<a href="https://www.facebook.com/studyatulster/">
<img id="Facebook" src="Facebook.png" alt="Facebook"
/></a>
<a
href="https://twitter.com/UlsterUni? ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor"
>
<img id="Twitter" src="Twitter.png" alt="Twitter"
/></a>
<a href="https://www.instagram.com/ulsteruni/?hl=en">
<img id="Instagram" src="Instagram.png" alt="Instagram"
/></a>
</div>
<p>Belfast Virtual Shopping Centre - Copyright 2020</p>
</div>
,
您应该关闭标签!
<a href="https://www.facebook.com/studyatulster/">
<img id="Facebook" src="Facebook.png" alt="Facebook"/>
</a>
如果不需要关闭图像(如图像),则可以在开始标记中添加斜线,如代码示例所示。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。