gpt4 book ai didi

html - 我的文本没有在 li 容器中居中

转载 作者:行者123 更新时间:2023-11-28 19:26:28 25 4
gpt4 key购买 nike

我正在努力将文本居中放置在 li 容器的中间。它似乎从左到右居中。但从上到下都不是。

我尝试向文本添加跨度并通过边距和填充移动它。我一直没有成功移动文本。

我希望文本在蓝色框的中心水平和垂直居中。现在,文本从左到右居中,但不是从上到下居中。

<html>

<style>
.follow-button {
height: 40px;
width: 100px;
background: #0081F2;
border: #0081F2;
color: #fff;
font-weight: bold;
text-align: center;
margin: 0;
padding: 0;
}

.follow-button:hover {
cursor: pointer;
bacgkround: #0059D0;
border-color: #0059D0;
}

#follow-button-nav {
list-style: none;
margin-left: 0;
padding-left: 0;
}
</style>

<ul id="follow-button-nav">
<li class="follow-button">Follow</li>
</ul>

</html>```

最佳答案

你不能将文本的高度居中,除了:

  • 你用顶部和底部填充进行调整
  • 在 td 内制作 div 并将垂直对齐更改为中间

觉得这个问题的讨论很多,你应该多搜索。现在是 2019 年

编辑:

而且我忘记了行高。虽然不推荐。您可以在按钮上添加行高 css。

.follow-button {
height: 40px;
width: 100px;
background: #0081F2;
border: #0081F2;
color: #fff;
font-weight: bold;
text-align: center;
margin: 0;
padding: 0;
line-height:40px;
}

这是 fiddle JSFiddle

关于html - 我的文本没有在 li 容器中居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56069597/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com