WEB 教程
实践 示例
HTML 参考手册
CSS 参考手册
PHP 参考手册

如何在 Bootstrap 中将按钮居中

主题:Bootstrap / Sass上一页|下一页

答案:使用text-center

您可以简单地使用包装器元素上的内置类 .text-center 来居中对齐 Bootstrap 中的按钮或其他内联元素。 它适用于 Bootstrap 3 和 4 版本。

让我们试试下面的例子来了解它的基本工作原理:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Center Align Buttons in Bootstrap</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="js/jquery-3.5.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head> 
<body>
    <div class="container bg-light">
        <div class="col-md-12 text-center">
            <button type="button" class="btn btn-primary">Submit</button>
            <button type="button" class="btn btn-warning">Cancel</button>
        </div>
    </div>
</body>
</html>

FAQ 相关问题解答

以下是与此主题相关的更多常见问题解答:

Advertisements