Question

我的一个html网页中的编码干扰了代码中的一行。我有一个社交媒体按钮，其中包含指向Youtube页面的链接，但该链接不仅适用于该按钮，还会使其下方的行成为链接。此外，似乎有一条线贯穿我的社交媒体图标，我不确定为什么会这样。任何帮助表示赞赏。

<!DOCTYPE html> 
<body class="contact">

<html>

  <title>TekMillion - Contact</title>

<p style="text-align:center;"><img src="images/TEKMILL%20logo%20RESIZE.png" alt="Tekmill Logo" width="839" height="322"></center></p>

<link rel="stylesheet" href="stylesheet.css">

<HR>

<nav>
    <ul>
        <li><a href="index.html">Home</a></li>
		<li><a href="videos.html">Videos</a></li>
		<li><a href="about.html">About</a></li>  
		<li><a href="merchandise.html">Shop</a></li>               
		<li><a href="contact.html">Contact</a></li>
		<li><a href="gallery.html">Gallery</a></li>
		<li><a href="#">Albums</a></li>
    </ul>
</nav>
<HR>

<div class="container">
</br>

<form action="form.php" method="post" enctype="multipart/form-data">
	        
	        <h1 class="title"><center>Contact US</h1></center>
	        
		    <label></label>
		    <input name="name" required="required" placeholder="Your Name">
		    
		            
		    <label></label>
		    <input name="email" type="email" required="required" placeholder="Your Email">
		            
		    
		    <label></label>
		    <textarea name="message" cols="20" rows="5" required="required" placeholder="Message"></textarea>
		    
		    		    
		    <center><input id="cancel" name="cancel" value="Cancel" />
		            
		    <input id="submit" name="submit" type="submit" value="Submit"></center>
	        
	    </form>
</br>
</br>
<span class="textformat1"><center><b>Social Media</span></center></b>
</br>
<center>
<a href="https://twitter.com/tekmill"> <img src="socialmedia/twitter.jpg" align="middle" alt="Instagram" width="80" height="80">
<a href="https://www.facebook.com/TekMillMusic"> <img src="socialmedia/facebook.jpg" align="middle" alt="Facebook" width="80" height="80">
<a href="https://plus.google.com/+TekMillMusic/videos"> <img src="socialmedia/googleplus.jpg" align="middle" alt="Google Plus" width="80" 
height="80">
<a href="https://soundcloud.com/tekmill"> <img src="socialmedia/soundcloud.jpg" align="middle" alt="Soundcloud" width="80" height="80">
<a href="https://youtube.com/tekmillmusic"> <img src="socialmedia/youtube.jpg" align="middle" alt="Youtube" width="80" height="80">
</center>
</br>
</div>
</html>
<hr>
</body>

link problem

感谢。

Answer 1

这是因为您尚未关闭a代码。

尝试

<a href="https://twitter.com/tekmill"> <img src="socialmedia/twitter.jpg" align="middle" alt="Instagram" width="80" height="80"></a>
<a href="https://www.facebook.com/TekMillMusic"> <img src="socialmedia/facebook.jpg" align="middle" alt="Facebook" width="80" height="80"></a>
<a href="https://plus.google.com/+TekMillMusic/videos"> <img src="socialmedia/googleplus.jpg" align="middle" alt="Google Plus" width="80"  height="80"></a>
<a href="https://soundcloud.com/tekmill"><img src="socialmedia/soundcloud.jpg" align="middle" alt="Soundcloud" width="80" height="80"></a> 
<a href="https://youtube.com/tekmillmusic"><img src="socialmedia/youtube.jpg" align="middle" alt="Youtube" width="80"  height="80"></a>

请注意每行末尾的</a>。

Answer 2

关闭 a代码和define您的a代码display inline-block 属性此

<a href=""></a> 

a{display:inline-block;vertical-align:top;}

Answer 3

您没有关闭任何ANCHOR代码......

<a href="https://twitter.com/tekmill"> <img src="socialmedia/twitter.jpg" align="middle" alt="Instagram" width="80" height="80">

应该是......

<a href="https://twitter.com/tekmill"> <img src="socialmedia/twitter.jpg" align="middle" alt="Instagram" width="80" height="80"> </a>

浏览器会将下一个A标记解释为前一个标记的结尾，因此您只会在最后一个标记上注意到这一点。

Answer 4

<style type="text/css">
.container a{

    text-decoration-line: unset;
}
</style>

html编码中的链接问题

4 个答案: