Question

我真的很抱歉提出这个问题，因为我知道有这方面的答案。我已阅读并阅读，似乎无法使其工作。显然有一些我做错了所以如果你能向我解释我应该做什么以及为什么我会非常感激。

footer {
  display: inline-block;
  position: relative;
  height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}
footer p {
  display: inline-block;
  vertical-align: middle;
  line-height: 1vh;
}

<footer>
  <p>Copyright 2016 - Say my name. All Rights Reserved</p>
</footer>

Answer 1

页脚内部不需要段落标记;只需将line-height: 15vh;添加到页脚，然后删除周围的段落标记。

＆＃13;

footer {
  display: inline-block;
  position: relative;
  height: 15vh;
  line-height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}

＆＃13;

<footer>
  Copyright 2016 - Say my name. All Rights Reserved
</footer>

＆＃13;

Answer 2

您可以使用display:table和display:table-cell属性。 Vertically centered text

<强> HTML：

<footer>
  <p>Copyright 2016 - Say my name. All Rights Reserved</p>
</footer>

<强> CSS：

footer {
  display: table;
  position: relative;
  height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}
footer p {
  display: table-cell;
  vertical-align: middle;
  line-height: 1vh;
}

footer {
  display: table;
  position: relative;
  height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}
footer p {
  display: table-cell;
  vertical-align: middle;
  line-height: 1vh;
}

<footer>
  <p>Copyright 2016 - Say my name. All Rights Reserved</p>
</footer>

或者您可以使用flex属性，但许多浏览器版本不支持该属性 Align using flex property

<强> CSS：

footer {
  display: flex;
  justify-content: center;        /* align horizontal */
  align-items: center;        /*ALIGN VERTICAL*/
  position: relative;
  height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}

footer p {  
   line-height: 1vh;
}

footer {
  display: flex;
  justify-content: center;        /* align horizontal */
  align-items: center;        /*ALIGN VERTICAL*/
  position: relative;
  height: 15vh;
  width: 100vw;
  background: #1a1a1a;
  border-top: 1px solid #232323;
  color: #a0a0a0;
  padding-left: 5%;
  box-sizing: border-box;
}

footer p {
  
  vertical-align: middle;
  line-height: 1vh;
}

<footer>
  <p>Copyright 2016 - Say my name. All Rights Reserved</p>
</footer>

Answer 3

试试这个 CSS ：

closure1Anon

Answer 4

FROM Table1 LEFT JOIN (Table2 LEFT JOIN Table3 
ON Table2.[Activity_Code] = Table3.[Activity_Code]) ON Table1.User_ID =
Table2.User_ID

如何垂直居中一行文字？

4 个答案: