使标题顶部中心的文本不左的最佳方法是什么

时间:2019-02-24 09:28:40

标签: php html css css3

如何使文字徽标从顶部到底部位于标题的中心,而不是从左至右的中心

enter image description here

header{
background-color: black;   
width:100%;
height: 50px; 
position: fixed;
z-index: 999;
}

.logo
{
float: left;
margin-left:200px;
font-size: 30px;
font-weight: bold;
color:

2 个答案:

答案 0 :(得分:0)

请勿使用float: left。最好的方法是使用flexbox容器。您需要给标题

display: flex;
align-items: center;

header{
  background-color: black;   
  width:100%;
  height: 50px; 
  position: fixed;
  z-index: 999;
  display: flex;
  align-items: center;
}

.logo {
  color: white;
  margin-left:200px;
  font-size: 30px;
  font-weight: bold;
}
<header>
  <div class="logo">Some Logo</div>
</header>

答案 1 :(得分:0)

这个简单的改变就可以实现

header{
    background-color: black;   
    width:100%;
    height: 50px; 
    position: fixed;
    text-align: center;
    z-index: 999;
    }

.logo{
    font-size: 30px;
    font-weight: bold;
    color:white
}