首页bootstrap div居中

bootstrap div居中

时间: 2023-09-09 11:10:31 浏览: 130

bootstrap 的弹窗垂直居中

引用bootstrap-dialog弹窗插件所以得弹窗都垂直居中了如： $.imgpic = function(src) { var $textAndPic = $('<div></div>'); $textAndPic.append('<img width="100%" height="100%" src="'+src+'"/>'); BootstrapDialog.show({ title : '图片展示', message : $textAndPic }); };

可以使用Bootstrap的flexbox布局来实现div居中。下面是一个简单的示例代码： ```html <div class="d-flex justify-content-center align-items-center"> <div class="my-div">内容</div> </div> ``` 在包含要居中的div的父元素上使用`d-flex justify-content-center align-items-center`类，这将使父元素成为一个flex容器，并将其子元素水平和垂直居中。然后，您可以将要居中的div放在父元素内。如果你想让div水平居中，同时保留原本的宽度，可以在`my-div`类上设置`text-center`类，如下所示： ```html <div class="d-flex justify-content-center align-items-center"> <div class="my-div text-center">内容</div> </div> ``` 这将使div文本水平居中。

阅读全文