Question

我使用html在页脚中设置了社交媒体图标，因为我尝试使用CSS时没有给出我想要的结果。问题是，现在我希望将图标固定在底部，但使用CSS进行操作并不起作用。这是现在的代码：

<div class="footer">
  <center>
    <a class="faceb" href="http://facebook.com/" title="Facebook" alt="faceb">
      <img src="http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png" hspace="5" style="PADDING-BOTTOM: 20px" onmouseover="this.src='http://www.sheisbiddy.com/wp-content/uploads/2015/11/faceb.png'"onmouseout="this.src=' http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png'" border="0" alt="" />
    </a>
  </center>
</div>

这就是我尝试过的无效的CSS：

#footer {
position:absolute;
bottom:0;
width:100%;
height:60px;   
}

Answer 1

您正在使用 id（＃）选择器而使用点（。），因为您在div中使用了类。

.footer {
position:absolute;
bottom:0;
width:100%;
height:60px;   
}

Answer 2

您的原始代码存在多个问题。首先，您永远不会关闭data <- seq(from=0,to=30,length.out=1000) q <- quantile(data) ggplot()+ geom_density(aes(x=data)) + annotate(geom="text", x=q, y=0, label=names(q)) + theme(text = element_text(size=10)) + geom_vline(x=q, linetype = "longdash")代码，但您可能应该在css中使用<center>，而不是折旧中心代码。

接下来，您使用ID选择器而不是类选择器。所以你有几个选择，你可以用以下代码替换你的CSS：

text-align:center;

或者您可以用以下内容替换HTML：

.footer {
    position:absolute;
    bottom:0;
    width:100%;
    height:60px;   
}

但我强烈建议您删除这些<div id="footer"> <center> <a class="faceb" href="http://facebook.com/" title="Facebook" alt="faceb"> <img src="http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png" hspace="5" style="PADDING-BOTTOM: 20px" onmouseover="this.src='http://www.sheisbiddy.com/wp-content/uploads/2015/11/faceb.png'"onmouseout="this.src=' http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png'" border="0" alt="" /> </a> </center> </div>代码并按以下方式更新：

center

<div id="footer">
  <a class="faceb" href="http://facebook.com/" title="Facebook" alt="faceb">
    <img src="http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png" hspace="5" style="PADDING-BOTTOM: 20px" onmouseover="this.src='http://www.sheisbiddy.com/wp-content/uploads/2015/11/faceb.png'"onmouseout="this.src=' http://www.sheisbiddy.com/wp-content/uploads/2015/11/wfaceb.png'" border="0" alt="" />
  </a>
</div>

使用html将页脚固定到底部

2 个答案: