css - 在 Bootstrap 中水平居中响应图像

标签 css twitter-bootstrap

如果具有 .img-responsive 类的图像宽度小于容器宽度,则它显示为左对齐。将 .text-center 添加到父元素似乎不起作用。这是一个例子:

<div class="col-sm-12 text-center">
  <img src="path/to/image.jpg" alt="Example Image" class="img-responsive" />
</div>

最佳答案

如果您真的想遵循 Twitter Bootstrap 语法,您应该使用 center-block 类,如文档中所述。

Link to the documentation

代码种类:

<img class="center-block" src="something.xxx" alt="xxx">

关于css - 在 Bootstrap 中水平居中响应图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30103364/

相关文章:

html - 使用 Bootstrap 按钮填充 div 高度

javascript - 如何制作悬停效果而不是在 bootstrap 4 下拉菜单中单击?

javascript - Bootstrap 导航栏不会因平滑滚动脚本而崩溃

javascript - 我无法使用 jQuery 验证以下文档的 ASP 输入

html - Bootstrap : How to center content vertically within a column

css - 将鼠标悬停在 1 个 div 上时,让 2 个 div 改变颜色

jquery - 如何创建一个函数来仅切换单击的元素?

javascript - 使下拉列表在 Bootstrap 响应表中可见

javascript - 在 CSS 转换期间触发事件

JavaFX 选择框文本颜色