将按钮在 Div 中居中
在 Web 开发中,通常希望将按钮在包含的 div 中居中。让我们探索应对这一挑战的两种解决方案:
使用 Flexbox
Flexbox 提供了一种沿两个轴对齐元素的优雅解决方案。要使按钮在 div 内水平和垂直居中:
#wrapper { display: flex; align-items: center; justify-content: center; }
如果仅需要水平居中,则可以使用 justify-content 属性:
#wrapper { display: flex; justify-content: center; }
Margin-基于方法
没有 Flexbox,可以使用以下方法将按钮居中margins:
button { margin: -20px -50px; /* Offset to center */ position: relative; top: 50%; left: 50%; }
仅对于水平居中,可以使用以下两种方法之一:
以上是如何将按钮置于 Div 中?的详细内容。更多信息请关注PHP中文网其他相关文章!