css - 垂直对齐元素

Question

我需要将p元素与页面的底部中心对齐，但是出了点问题。我正在制作一个 HTML5 页面。

这是 CSS 选择器：

p { vertical-align:80px; }

Answer 1

如果您需要“将 p 元素与页面底部中心对齐”

p {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
}

演示

但这不是大多数网站的最佳解决方案。假设，您正在尝试使用某些版权（或年份，或您的姓名）制作页脚。在这种情况下，您必须使用更复杂的 html 和 css，包括主 div、页脚 div 等。

Answer 2

请试试这个：

CSS

html,body{
  marign: 0;
  padding: 0;
  height: 100%;
}
body:after {
  content: "";
  display: inline-block;
  height: 100%;
  width: 0;
}
p{
  display: inline-block;
  vertical-align: bottom;
}

请查看演示。您将更改vertical-alignfor p，将他放在顶部或中间。