我正在学习中,但是有问题。我在css中将背景图像做为页脚,并链接了起来。使用的文字缩进:-9999px;删除页脚图片顶部的H1。有人告诉我在其中编写h1以便在语义上正确,因此搜索引擎仍然可以看到它。然后将其与文本缩进一起隐藏。我想在该页脚上方放置四个社交媒体图标,这些图标可作为链接单击。我一直卡住。

<footer id="footer">
   <section id="socialmedia">

       <a href="http://www.facebook.com/BenoitBelgium">
                <img src="../images/facebook.png" width="56" height="54" alt="Facebook icon" title="Go to Facebook."  />
       </a>

       <a href="http://www.facebook.com/brilliantben">
                <img src="../images/pinterest.png" width="54" height="54" alt="Pinterest icon" title="Go to Pinterest"  />
       </a>



       <a href="http://www.facebook.com/BenoitBelgium">
                <img src="../images/twitter.png" width="54" height="54" alt="Twitter icon" title="Go to Twitter."  />
       </a>

       <a href="http://www.facebook.com/BenoitBelgium">
                <img src="../images/behance.png" width="55" height="54" alt="Behance icon" title="Go to Behance."  />
       </a>

   </section>

        <h1><a href="#">Goodbye, feel free to follow</a></h1>
</footer>


这是我的CSS。

#footer {
    background-image: url(../images/footer.png);
    height:214px;
    width: 960px;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0 auto;
    border-style: solid;
    border-width: 1px;

}

#footer a {
    text-indent: -9999px;
    height:214px;
    width:100%;
    display:block;


}


This is the footer I am trying to make.

谢谢

最佳答案

text-indent使图像不可见。去掉它。

#footer a {
    height:214px;
    width:100%;
    display:block;
}

关于html - 页脚背景图片顶部的图标,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/19369802/

10-12 00:22
查看更多