Question

出于某种原因，我的每个社交媒体图片的右下方都有一条很小的水平线，我放在我网站的标题上。我试图找到他们为什么出现的解释，更重要的是，如何隐藏它们。有谁知道如何删除它们？非常感谢你。

enter image description here

代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/>
<title> Chilun</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
<style type="text/css">
@font-face /* support for browsers & IE v10 onwards*/
{font-family:homefont; src: url("font.ttf");}
{font-family:headerfont; src: url("playball.ttf");}
body {background:url('img/mybackground3.jpg') no-repeat center center fixed;}

<!-- Make Header Sticky -->
#header_container {background:#00E5EE; border:0px solid #666; height:70px; left:0; position:fixed; width:100%; top:0;}
#header{padding: 0.3em 0; border-bottom: 0px; overflow: hidden; zoom: 1; line-height:0px; margin:0 auto; width:940px; text-align:right;display:inline-block; float:right;vertical-align:bottom;}
#wrapper{width:900px;margin:0 auto;}
a{color:#444;}
.logo{margin-left:600px;margin-top:100px;background:#fff;padding:10px;}
.bigtitle{font-family: homefont; font-size:120px; text-align:center; margin-top:200px;}
.header{top:100%; left:50%; font-family: headerfont; font-size:20px; color:#FFFFFF; font-style:italic; padding-top:0px; padding-bottom:0px; padding-right:20px; padding-left:0px;}
</style>
</head>
<body>

<!-- BEGIN: Sticky Header -->
<div id="header_container">
    <div id="header"><p class="header"> Follow me on:

    <a href="https://www.facebook.com/chilunliuTheBOSSE"><img src="/img/facebook-lnk.gif" alt="View my Facebook Profile" width="40" height="40" border="0">
    <a href="https://plus.google.com/u/0/+chilunliu/posts/p/pub"><img src="/img/googleplus-lnk.gif" alt="View my Google Plus Profile" width="40" height="40" border="0">

     <a style="margin:0; href="http://www.linkedin.com/pub/chilun-liu/1b/297/416"; View my Linkedin Profile </a><img src="/img/linkedin-lnk.gif" width="40" height="40">
    <a style="margin:0; href=""; Email me </a><img src="/img/email-lnk.gif" width="40" height="40">
    <a style="margin:0; href="http://www.youtube.com/user/chilunliu"; View my Youtube Channel</a><img src="/img/youtube-lnk.gif" width="40" height="40">
    </div>
    </p>

</div>
<!-- END: Sticky Header -->

    <div id="wrapper">
      <h2 class="bigtitle">
      <p>
      Chilun
      Liu
      </p>
      </h2>
     </div>

</body>
</html>

Answer 1

您缺少所有</a>结束标记...

Answer 2

<a style="margin:0;" href="http://www.linkedin.com/pub/chilun-liu/1b/297/416"> View my Linkedin Profile</a> <img src="/img/linkedin-lnk.gif" width="40" height="40">
<a style="margin:0;" href=""> Email me </a><img src="/img/email-lnk.gif" width="40" height="40">
<a style="margin:0;" href="http://www.youtube.com/user/chilunliu"> View my Youtube Channel</a><img src="/img/youtube-lnk.gif" width="40" height="40">

这是你的标签应该如何关闭

Answer 3

接下来关于使用<a>关闭</a>代码的所有其他内容。
你需要在你的CSS中设置它。我有同样的问题，text-decoration: none;是我的解决方案。

<强>的CSS

a { text-decoration: none};

Answer 4

检查更改的标签。

<a style="margin:0;" href="http://www.linkedin.com/pub/chilun-liu/1b/297/416"> View my Linkedin Profile </a>
<img src="/img/linkedin-lnk.gif" width="40" height="40">
<a style="margin:0;" href=""> Email me </a>
<img src="/img/email-lnk.gif" width="40" height="40">
<a style="margin:0;" href="http://www.youtube.com/user/chilunliu"> View my Youtube Channel</a><img src="/img/youtube-lnk.gif" width="40" height="40">

以下是标记的结果，并且没有下划线:)

查看我的Linkedin个人资料给我发邮件查看我的Youtube频道

希望这有帮助。

Answer 5

感谢大家的意见 - 感谢所有的反馈。这个链接 - http://webdesign.about.com/od/htmltags/ht/htlinkimage.htm或多或少解决了我的问题

网页图片href - 小水平线

5 个答案: