时间戳

首页 > 解决方案 > 是否可以将我的页脚固定在中心并且文本继续以不同的颜色闪烁

html - 是否可以将我的页脚固定在中心并且文本继续以不同的颜色闪烁

问题描述

这是我的页脚代码。我的目标是固定中心的页脚，并且文本“欢迎来到 tpopenhouse”继续以不同的颜色闪烁

}
.movement1 {
  /* footer movement*/
  
  height: 50px;
  background: #1976d2;
  position: relative;
  /*-webkit-animation: myfirst 1s 1; /* Safari 4.0 - 8.0 */
  
  -webkit-animation-direction: alternate;
  /* Safari 4.0 - 8.0 */
  
  animation: myfirst1 6s 100000;
  /*Time of animation and 5s and 100000 cycle of animation on refreshing*/
  
  animation-direction: alternate;
  */
}
<!-- Footer -->
<footer class="section  lighten-3 darken-2 white-text center " style="position:fixed;width: 80%;;bottom:0">
  <p class="flow-text movement1"> #TPOpenhouse & Stand To Win Prizes </p>
  <!-- Footer text -->
</footer>

标签： htmlcssfooter

解决方案

执行以下操作将页脚中心固定在底部：

您的页脚从页面底部略微向上，因为您在<p>具有默认边距的元素上应用了背景颜色，因此应用背景颜色footer而不是<p>.

footer {
    background: #1976d2;
    left: 50%;
    transform: translateX(-50%);
}

通过应用left和transform属性，您的页脚也将被放置在中心。

推荐阅读