在Div中居中按钮，在其他居中文本下方
，可以通过以下步骤实现：
- 首先，在HTML中创建一个Div元素，用于包裹按钮和文本。
<div class="container">
<button class="centered-button">按钮</button>
<p class="centered-text">其他居中文本</p>
</div>- 接下来，在CSS中定义样式来实现居中效果。
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh; /* 设置Div高度为视口高度，使其居中显示 */
}
.centered-button {
margin-bottom: 10px; /* 设置按钮与文本之间的间距 */
}
.centered-text {
text-align: center;
}解释：
- 通过
display: flex;将Div元素设置为弹性布局，使其内部元素可以方便地进行居中操作。 flex-direction: column;将内部元素垂直排列。align-items: center;和justify-content: center;将内部元素在水平和垂直方向上居中对齐。height: 100vh;将Div元素的高度设置为视口高度，使其垂直居中显示。margin-bottom: 10px;为按钮设置底部间距，使其与文本之间有一定的间隔。text-align: center;将文本内容水平居中对齐。
推荐的腾讯云相关产品和产品介绍链接地址：
- 腾讯云产品：云服务器（CVM）- https://cloud.tencent.com/product/cvm
- 腾讯云产品：云数据库 MySQL 版 - https://cloud.tencent.com/product/cdb_mysql
- 腾讯云产品：云存储（COS）- https://cloud.tencent.com/product/cos
- 腾讯云产品：人工智能 - https://cloud.tencent.com/product/ai
- 腾讯云产品：物联网 - https://cloud.tencent.com/product/iotexplorer
- 腾讯云产品：移动开发 - https://cloud.tencent.com/product/mobdev
- 腾讯云产品：区块链 - https://cloud.tencent.com/product/baas
- 腾讯云产品：元宇宙 - https://cloud.tencent.com/product/mu
相关·内容
8回答
我正在创建一个div，里面有一堆按钮
<div>
<button>a</button><button>b</button>
</div>
我希望按钮在div中对齐或居中。将有几行按钮，它们本质上应该看起来像文本，但居中/对齐。
浏览 0提问于2014-08-04得票数 2
1回答
我有一个按钮，里面有一些文本，它在一行中显示文本，这是可以的，但是当我使用display:block对按钮进行居中时，按钮是居中的--这很好，但是它里面的文本有一个断线，并分成两行，我希望文本只显示在一行中:这是我的代码：
<div class="MyClass"><a type="button" style="margin:auto; display:block" class="ButtonLink" href="@Url.Action("MyAction","MyControl
浏览 0提问于2016-12-12得票数 3
回答已采纳
2回答
我在把一些按钮和图片放在div的中心位置时遇到了一些麻烦。如下图所示：
现在你可以看到，按钮和图片等没有居中(可能值得一提的是，这些东西在表单标签中)。当然，我有一些测试文本会居中显示。
我的HTML的结构如下：
<div class="navigationButtons">
<form>
</form>
<p>Some tect that gets centered...</p>
</div>
和我的CSS：
.navigationButtons{
text-align:
浏览 3提问于2011-08-26得票数 1
回答已采纳
我必须做一个自定义的按钮。问题是按钮上的文本没有居中对齐。我制作了与UIButton框架大小相同的文本标签。文本标签的文本对齐居中。
但它并不完全在中心。在右边。
浏览 1提问于2012-11-23得票数 0
1回答
我有各种各样的ToggleButtons，其中加载了一个图像。按钮大小由图像大小决定，按钮本身由JavaCode创建。一些按钮的左侧或右侧都有图标(该图标只是加载图像的一部分)。
如何将文本向左或向右移动特定值，以便再次居中文本，但具有图标的偏移量？我不介意传递图标的宽度作为参数，但我找不到任何东西来移动一定数量的文本。
按钮是从绿色图像创建的，右边的图标是它的一部分；总宽度是300，图标是100；文本应该居中到剩余的200。由于语言设置的原因，文本本身不能是图片的一部分。
浏览 0提问于2013-04-22得票数 0
我有这些HTML和CSS：
#siteInfo input[type="button"] {
background: none repeat scroll 0 0 #66A3D2;
border-color: #FFFFFF #327CB5 #327CB5 #FFFFFF;
border-radius: 10px 10px 10px 10px;
border-style: solid;
border-width: 1px;
box-shadow: 1px 1px 3px #333333;
color: #FFFFFF;
cursor: poi
浏览 0提问于2012-02-14得票数 48
回答已采纳
2回答
使表单居中，但保持其内容对齐
、、、、
我有一个三栏的页面。每列都是一个div，具有以下样式：
.Row1 {
text-align:center;
display:inline-block;
vertical-align:top;
padding:0.5%;
width:31.5%;
}
HTML如下：
<div class="Row1">
<h2>Header</h2>
<br />
<form>
Form stuff goes here
</form>
浏览 1提问于2013-07-01得票数 0
我对我的标题栏使用了一个基于ConstraintLayout的自定义布局。我需要居中的标题文本，而不是重叠的按钮在任何一边。目前我已经让标题在侧边按钮之间居中，但由于它们的宽度不同，所以标题不在父视图中居中。
这是它当前的样子(在两个按钮之间居中，而不是在父按钮中居中)：
有没有办法使标题在父级中居中，同时确保它不会与两侧的按钮文本重叠(因为这是可以改变的)？
更复杂的是，如果没有足够的空间让标题和按钮文本都完整显示，我还希望它是标题而不是按钮文本。
如果我将标题的两个边都限制在父级，并将其设置为换行宽度，那么它几乎可以正常工作，直到按钮文本变得有点长。
浏览 23提问于2019-06-12得票数 4
2回答
我在引导程序中创建了一个面板标题，并尝试将其文本居中，同时有一个按钮，该按钮应该与文本处于相同的水平轴上，但它是向右拉的，但我的输出是：
按钮没有与文本水平对齐
文本居中于标题的左边和按钮的左边，而不是在标题的左和右之间。
这是我的密码：
<div class='container'>
<div class='panel panel-default'>
<div class='panel-heading'>
<div class='p
浏览 4提问于2016-04-22得票数 4
回答已采纳
1回答
这是我想要的。黑色部分是集装箱舱。蓝色部分是主标题文本div，粉红色部分是应该放置在容器div右侧的按钮。
问:如何将标题文本居中，所以它将是容器div的中心，而不是蓝色部分的中心？我的问题是，当我给出粉红色按钮的位置:绝对；该按钮保持浮动时，滚动。
浏览 0提问于2022-11-23得票数 -1
回答已采纳
2回答
我有一个按钮，它可以覆盖屏幕的全部宽度：
<button class="btn btn-default">
<div class="center-copy">
<p class="answer-copy-1">accusantium quia sunt</p>
<p class="question-results">44%</p>
</div>
</button>
我希望第一段标签中的文本居中，其背
浏览 3提问于2013-08-08得票数 0
回答已采纳
我正在努力解决CSS的放置问题。 对于一个项目，我使用clipboard.js复制p标记的内容。 在div中，我把文本放在左边，右边有一个按钮，上面有一个用来复制文本的图标。文本的大小是动态的，如果文本超过div的长度，我会将其剪切。 我正在寻找一个:1-垂直对齐文本(如果文本太长，在几行上)2-将按钮放在右边，左边留出空白处。3-按钮垂直居中 我设法使用display: inline-block属性将文本和按钮放在一行上，但按钮和文本都没有垂直居中。 下面是我的代码：https://jsfiddle.net/n70jrymp/
浏览 19提问于2020-11-28得票数 2
回答已采纳
我有一个内容div，里面有一个paragraph_content div，里面有段落。
内容div为1000 is宽。现在，paragraph_content自动应用内容的1000 of宽度。所以我永远不能用页边距对它:0自动，这样段落中的文字就会居中。现在我可以做文本对齐:居中，但是这些线不能同时显示在彼此下面，因为有些线比较短，而且都是居中的。
我想要它的中心，所有的文字行放在一起，而不是一些跳进以后。
我希望它居中，这样如果文本被调整，它不仅会在右边展开，而且左边和右边都会自动展开，这样所有的内容都保持在中心位置。
我所拥有的：
#content{
width: 1000px;
浏览 1提问于2013-11-14得票数 0
回答已采纳
1回答
回复：
是否可以将位置:绝对div居中于其父位置:相对div？
这个想法是制作一个按钮，它的文本是两个值中的一个。它的宽度保持较长的值的长度。当显示两个值中较短的一个时，文本在按钮中居中。我不想在px中指定任何宽度。
浏览 2提问于2012-05-12得票数 2
回答已采纳
1回答
我是stackoverflow的新手，也是web开发的新手。我相信我要做的事情的第一部分应该很简单，但我在弄清楚它时遇到了相当多的麻烦。
第一种风格显然是居中我的背景图像，这似乎工作得很好。我下一步要做的是向页面添加3个元素。1.图形，2.固定大小的文本区域，将输入的字符量限制为300个字符，以及3.提交按钮。
我希望所有这些元素都居中。文本区应该直接居中，图形应该对齐到文本区的左边缘和它上面的10px，提交按钮应该对齐到它下面的10px。
这就是我所拥有的：
html {
background: url(field1.jpg) no-repeat center cente
浏览 3提问于2012-09-14得票数 2
回答已采纳
我在引导巨型加速器中的一个按钮的中心有问题。我已经尝试过在Stack Overflow上使用文本居中对齐，边距自动0px和其他解决方案。我把我的按钮放在一个容器里，这个容器在巨型加速器里面。我不想将容器居中，因为这样巨型加速器上的文本也会居中，这是我不想要的。我只想让按钮居中。
这是我的HTML代码
<div class="jumbotron">
<div class="container" >
<h2>Keep your heart as if you have just entered this
浏览 11提问于2017-07-16得票数 3
回答已采纳
我有一个有三个孩子的内部div，一个按钮，一些文本和一个按钮组。
我使用flex对所有内容进行居中，但问题是文本实际上并不是围绕包含元素的中心。相反，它将文本放在按钮和按钮组的近边框之间。
文本不在黄色框中居中。我希望文本在黄色框中居中。
有没有什么方法可以说“从外部元素的边缘测量，忽略兄弟姐妹的内在边缘”？
.outer-box {
width: 100%;
display: flex;
justify-content: center;
}
.inner-box {
width: 500px;
height: 60px;
background-color:
浏览 3提问于2019-03-28得票数 1
回答已采纳
1回答
我们有外部div header，它有100%宽度的容器。div用于标题文本和右边的按钮。文本必须居中到header，并且按钮必须在右侧。但是如果文本足够长，可以与按钮重叠，那么文本应该填充header的左侧，而不是继续按钮。
header -> [ [CENTER TEXT] [button]]
OR (with wider CENTER TEXT)
header -> [[abcdabcdab CENTER TEXT cd][button]]
将其作为中心文本的子项放置时，已尝试使用header->text上的position: relati
浏览 7提问于2015-12-06得票数 2
我使用Bootstrap3中的.btn-toolbar类在一些标题文本的两侧放置按钮。我需要标题文本居中，所以我使用.text-center类。 文本确实相对于按钮之间的空间居中。但我希望文本在页面本身居中，就像下面示例中标题下的main部分的文本一样。 有什么方法可以做到这一点吗？ 这里有一个例子，希望能更好地说明这一点： h2 {
background-color: #e3e3e3;
text-align: center;
}
.main {
text-align: center;
}
.btn {
margin-right: 5px;
} <link re
浏览 9提问于2020-07-25得票数 0
回答已采纳
5回答
为什么放置在flex容器中的按钮通过使用margin : 0px auto;来居中，而放置在普通容器中的按钮却不是？
另外，我能做些什么来使按钮在普通容器中居中(我不能更改我的HTML，所以最好是CSS解决方案)。
.flex-container {
display: flex;
background: yellow;
}
.normal-container {
background: green;
}
button {
margin: 0px auto;
}
<div class="flex-container">
<button&g
浏览 14提问于2016-05-02得票数 2
回答已采纳
1回答
我想把div的样式和按钮完全一样。我注意到当我给按钮一个特定的高度时，文本总是垂直地居中。
到目前为止，我尝试挖掘Chromium代理样式表，但没有成功。-webkit-appereance: button也没有做到这一点。
下面是这个问题的演示：。注意，内联块样式可以确保文本垂直对齐--包围框仍然很奇怪。
哪个属性使文本垂直居中，而不需要任何附加包装？这里发生什么事情？
浏览 2提问于2018-12-28得票数 1
回答已采纳
我有一个输入框和一个按钮。我希望按钮坐在所有devices > 768 px输入框的右边。
对于devices <=768 px，我希望按钮位于输入框下面，输入框对齐在col-xs-12的中心。
这是我迄今为止的尝试：
<form id="signup-form" class="new_invitation" action="/invitations" accept-charset="UTF-8" method="post">
<div class="col-sm-4 co
浏览 6提问于2016-01-12得票数 5
我正在尝试对齐电影海报图像，描述文字和添加到购物车按钮在同一行。文本需要居中对齐，而不是环绕按钮或图像。它应该看起来像这样。
然而，在我当前的代码中，它看起来像这样。影片描述文本不是居中对齐的，它会环绕按钮。
这是我的代码。我如何修改它才能使它看起来像第一张图片？
<div class="card-block">
<div class="pull-left"><img src="https://{{movie.image}}" alt="[Image Missing]&
浏览 3提问于2018-11-09得票数 0
1回答
您知道如何选择ID vía CSS中包含单词的div吗？+1 Button使用ID "___plusone_1“添加iframes，每个按钮上的姓氏都会增加，我想对所有plusone标记应用CSS规则。
#___*PLUSONE* {
width:100px;
}
另外，我希望垂直地将图像中的文本居中。
这是JSfiddle：
谢谢
浏览 5提问于2012-03-19得票数 1
回答已采纳
我需要将文本居中。我使用了文本居中对齐，但下一行居中。我需要它与顶部的线对齐。
<div class="box">
<div class="text">Some text.Some text.Some text.Some text.Some text.Some text.Some text.
Some text.Some text.Some text.Some text.Some text.</div>
</div>
如何在下一行不相对于顶行居中的情况下将文本块居中？
浏览 0提问于2013-05-15得票数 1
回答已采纳
我有以下布局，这里是布局的
<div class="container-fluid" >
<div class="row">
<div class="col-xs-12 col-sm-5">
<label><strong>Field One</strong></label>
<div class="form-group">
<input type="text
浏览 0提问于2017-04-15得票数 0
3回答
无法垂直对齐我的图像
、、、
我正试着将图像垂直地居中，这将是我的提交按钮。我有这个HTML
<div style="display:inline-block; vertical-align:middle"><input alt="Search" type="image" src="/assets/magnifying-glass-0220f37269f90a370c3bb60229240f2ef2a4e15b335cd42e64563ba65e4f22e4.png" class="search_button"><
浏览 9提问于2016-08-23得票数 0
回答已采纳
你可以看看我在上想要做什么。包含两行文本的居中div，左右两侧的文本与居中div底部的文本相邻。
我希望文本在页面上居中(无论是主要的"hello world“或第二行)。现在，我正在使用一个具有指定width和margin: auto的外部div。如果宽度太大，文本将不会居中显示；如果宽度对于内部文本来说太小，则div将堆叠：。
有没有更好的方法来居中这三个浮动的div，同时仍然让左右文本与中心div的第二行对齐？
任何建议都将不胜感激。CSS不是我的强项，但我正在学习。
浏览 0提问于2012-06-19得票数 2
回答已采纳
1回答
CSS:文本不会居中？
、、、
有没有人知道我在这方面出了什么问题？我试图居中的文本在一个按钮的导航使用CSS。
#nav {
margin:20px 0 0 0;
}
#nav ul {
margin:0;
}
#nav li:first-child {
width:80px;
height:30px;
display:inline-block;
background-color:#8f00ae;
text-align:center;
}
#nav ul li a {
}
这是我的html。
<!-- Navigation Section -->
<div cla
浏览 1提问于2012-03-13得票数 0
回答已采纳
3回答
在css中很容易对齐文本！通过使用文本对齐:居中，但我只是做了这个
.readmore {
width: 80px;
height: 30px;
background: #000000;
text-align: center;
border-radius: 3px;
float: center;
color: #fff;
font-family: 'Rambla', sans-serif;
-webkit-transition: background-color 1s;
-o-transition:
浏览 3提问于2013-11-02得票数 0
回答已采纳
2回答
我有一个div，里面有一个button。这个按钮是一个基本的Bootstrap按钮。这是我的代码：
<div class="generateBtn">
<button class="btn">Generate Statement</button>
</div>
generateBtn的css如下所示
.generateBtn {
background: #ccc;
padding: 10px 10px 10px 30px;
}
下面是一张页面上的图片：
我想在div中的
浏览 6提问于2014-12-01得票数 0
回答已采纳
2回答
希望在div的左侧有一个图像(徽标)，文本(标题)以div为中心。一个基本的问题，但也有一些注意事项。
如果我在图像上使用position: absolute，文本是居中的，但是当我调整窗口的大小时，图像就覆盖了文本。希望这是一个响应页面，其中的文本是居中的，直到它击中图像和不会重叠。
如果我在图像上使用float: left，那么文本实际上不是完全居中的。
我可以在文本的另一边创建一个同样大小的margin-right，但是我把这些像素浪费在更小的显示器上，我不想这样做。最终，这将不仅仅是我所关注的那条线。
基本上，我想：
只要屏幕足够宽，文本就以中心为中心。
当屏幕不够宽时，要环绕
浏览 4提问于2015-08-18得票数 0
7回答
似乎围绕着<button>元素有一些我不理解的魔力。
考虑一下这个标记：
<button class="button">Some Text</button>
<div class="button">Some Text</div>
还有这个CSS：
.button{
background: darkgrey;
height: 40px;
border: 2px solid grey;
width: 100%;
box-sizing: border-box;
浏览 0提问于2013-04-02得票数 41
回答已采纳
3回答
我有一个包含一些段落的div，我想按需通过.show()显示这些段落。在div中还有另一个div，其中包含一个按钮。该div将text-align设置为居中，这样我的按钮就位于段落中所有文本的中间。 使用show(1000)时，文本会从上到下呈现动画效果，这正是我想要的效果。然而，按钮并没有遵循这种行为，而是从左侧滑入。 $('.showme').show(1000); .wrapper {
text-align: center;
}
.button {
position: absolute;
}
浏览 24提问于2019-03-13得票数 0
回答已采纳
2回答
在元素中对齐引导按钮组
、、、
我正试图找出在元素中对引导按钮组(即btn-group)进行居中的最佳方法。因此，例如，如果您有以下内容：
<div id='toolbar'>
<div class="btn-group">
<button type="button" class="btn btn-default">Command1</button>
<button type="button" class="btn btn-default"
浏览 2提问于2014-01-27得票数 5
回答已采纳
2回答
我要我的纽扣和锚看起来一样。但是，当我有一个按钮/锚长文本，它应该打破和显示文本垂直居中。当有足够的空间时，文本也应该居中。
为了使文本居中而不是溢出，当文本中断时，我设置了line-height:1，也设置了vertical-align:1，当然，我必须设置white-space: normal，否则文本不会中断，按钮会溢出。
现在我有以下问题(用铬测试)：当文本是一行时，它将不再在锚标记中居中.此外，，我不想更改DOM (将文本封装在span中等)
你能告诉我为什么这个按钮和锚不同吗？我已经检查了铬检查器中的所有样式(计算的->显示所有样式)。我还检查了:before和:after样
浏览 0提问于2016-10-10得票数 8
回答已采纳
我在fxml中有一个GridPane，它有一个文本标题和4个按钮。GridPane本身居中对齐，但所有按钮在网格的列中左对齐。我知道如何使用Java代码更改项的对齐方式，但这不是理想的情况，因为我希望所有样式都使用FXML和CSS处理。有人能建议在JavaFX的GridPane视图中居中对齐单元格元素的最佳方法吗？
浏览 1提问于2014-09-16得票数 10
我有一个非常简单的按钮。当你在Safari或Chrome中看到文本时，文本显示在右边，垂直居中，尊重正方形。但是在Firefox中，文本不是垂直居中(它向下看)，如何解决这个问题？
HTML：
<div class="buy">mmmmm</div>
CSS：
body {
font-family:Tahoma;
color:#fff;
font-size:11px;
letter-spacing:1px;
}
.buy {
position:absolute;
width: 70px;
height: 20px;
浏览 2提问于2012-05-17得票数 0
回答已采纳
我试图对div中的文本应用页边距，使文本以水平和垂直的方式居中。我不确定是否有更好的方法来做到这一点，因为我对HTML和编程非常陌生。
<!-- begin header -->
<header style="background-color:#8b0000" style="height:50px;">
<!-- frankenstien-ish bootstrap grid within a bootstrap grid -->
<div class="row">
<div class=
浏览 4提问于2017-06-08得票数 0
回答已采纳
因此，我的标题有一个AppBar组件，我希望标题在AppBar中居中。如你所见，我在左边有一个按钮，在右边有一个按钮。我会把这些按钮分别放在左边和右边。 const styles = {
root: {
flexGrow: 1
}
};
class Header extends Component {
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
<AppBar position="
浏览 20提问于2019-05-23得票数 0
1回答
我有两个按钮，它们在我的列中水平居中，但还不能弄清楚如何垂直居中。我试着使用“垂直对齐-中间”。下面是我的UI代码：
ui <- shinyUI(fluidPage(
tags$style(
HTML('
#buttons {
background-color:yellow; position:fixed; margin-bottom:50px; vertical-align: middle; opacity:1; height:50px; z-index:5;
}
#fluidrow1 {
浏览 10提问于2020-02-06得票数 4
回答已采纳
为了在表单元格中垂直居中对齐文本，我在td中使用了vertical-align: middle。
但上述方法不适用于div、span、header和其他非table元素。那么，如何在这样的元素中垂直居中对齐文本呢？
浏览 13提问于2009-08-25得票数 1
回答已采纳
4回答
所以我有两个元素，在我的例子中是一个图像和一个按钮。我有在页面顶部的图像和底部的按钮。我希望有一个div (或其他一些元素)来显示文本，但我需要它在两个元素之间居中。
<div style="text-align: center;">
<img src="http://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="" />
<div style="text-align: center; bord
浏览 6提问于2017-07-12得票数 0
2回答
我有一个模板，在这个模板中，我循环遍历项目并创建一个按钮：
<div *ngFor="let button of buttons">
<p>
<button
type="button"
mat-raised-button
color="primary"
>
{{ button.text }}
</button>
</p>
</div>
我想在按钮之间加一个文本。
列表可以包含多
浏览 8提问于2021-07-18得票数 0
回答已采纳
3回答
如何将文本居中到行内列内的按钮下面？我希望<small>标记中的文本对齐正好位于按钮下面的中心：
HTML:
<div class="container">
<div class="row">
<div class="col-md-9 vcenter">
<h2>Talk to us about your <span class="u">next</span&g
浏览 2提问于2016-06-21得票数 5
回答已采纳
3回答
注意(在移动布局中)：两个按钮的高度相同。高度由长名称的按钮决定。第一个按钮中的文本垂直和水平地居中。
注意(在桌面布局中)：两个按钮的宽度相同。宽度由具有长名称的宽度按钮确定。这意味着每个按钮不需要占用屏幕的50%。第一个按钮的文本是居中的。另外，这两个按钮的中间有一些空格。
我有两个按钮相接在一起，如下代码所示：
.my-buttons {
display: flex;
justify-content: center;
button {
cursor: pointer;
}
}
<div class="
浏览 1提问于2021-10-02得票数 1
回答已采纳
4回答
我已经工作了一整晚来居中两个内联模块，但我似乎做不到。框架要么令人难以置信地偏移了页面，要么就停留在左边。我尝试过将文本居中(这将使其他所有内容居中)，并通过CSS设置左边距左。找不到一个好的解决方案。带有"box“类的div需要居中，有两个。
我的代码在这个上，任何帮助都很感谢。
div#signin-reg {
margin-left: auto;
margin-right: auto;
position: absolute;
}
div.box {
padding: 2.5px;
float: middle;
vertical-ali
浏览 0提问于2015-06-05得票数 0
3回答
实际上，我想知道如何正确地将按钮中的文本居中。我使用的是一种自定义字体，无论我做什么，它都不会使我的文本在按钮内居中。 我已经发现，对于标准字体(我猜是它的Roboto)，它也不能完美地居中对齐，但这在这一点上并不是很烦人。 下面是我的代码： RaisedButton(
onPressed: () {},
child: Text("LOG IN"),
), 下面是它对我的自定义字体产生的结果： ? 这里是标准的Roboto： ? 非常感谢!
浏览 41提问于2020-04-13得票数 0
回答已采纳
3回答
就一个简单的。我有3个字体可怕的图标，我正在使用的联系按钮在我的网页上。它们垂直对齐，并在容器div中居中。我还在每个图标旁边有文本，这会导致图标和文本都在页面上居中。我要做的是竖直地对图标进行居中，并让文字单独跟着。我相信我可以将图标包装在一个容器中，然后将所有相应的文本放在另一个容器中，但我意识到这在我的CSS中看起来会很混乱。肯定有一个简单的答案，我没有意识到。如果您不明白我正在做什么，请查看下面的代码片段。谢谢你的反馈。
<section class="contact-main">
<div class="container">
浏览 0提问于2018-02-28得票数 0
回答已采纳
2回答
我有一个角度材质按钮：
<a mat-raised-button class="buttons-class" color="accent">Hello!</a>
我已经增加了它的大小：
.buttons-class {
height: 60px !important;
width: 210px !important;
align-items: center;
}
现在，我希望将其中的文本(Hello!)居中。当前文本的偏移量如下：
将文本放在span或div中并使用标准的居中技术不起作用。
浏览 18提问于2021-06-08得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
