这篇文章主要介绍“bootstrap如何设置居中”，在日常操作中，相信很多人在bootstrap如何设置居中问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”bootstrap如何设置居中”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！
1.首相我们先创建新的项目先来看看没有设置之前的样式结果和代码如下：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link ref="stylesheet" href="css/bootstrap-grid.min.css">
</head>
<body>
<div >hhhh</div>
</body>
</html>2.修改样式在代码中加入 margin: 0 auto ；使得我们的盒子位置处于居中的状态。代码如下：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link ref="stylesheet" href="css/bootstrap-grid.min.css">
</head>
<body>
<div >hhhh</div>
</body>
</html>当我们把div的换成button之后就算加了 margin: 0 auto;这个属性也不会进行居中，会保持在靠左的位置，所以这时候我们就需要在 margin: 0 auto; 这属性后面添加 display:block 属性才可以让 button 元素居中显示。而且如果要让我们的文字居中的话要加上 text-align:center;的属性才可以显示居中。
到此，关于“bootstrap如何设置居中”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注亿速云网站，小编会继续努力为大家带来更多实用的文章！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
