Html Bootstrap：如何在面板标题中居中图像？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20269692/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap: How to center image in panel heading?
提问by Dylan Richards
I have a class of 'panel-heading center', but the image in the panel isn't centering. How can I make that happen?
我有一类“面板标题中心”，但面板中的图像没有居中。我怎样才能做到这一点？
<%= link_to 'Back', things_path %>
<div class='row'>
<div class='col-md-offset-2 col-md-8'>
<div class='panel panel-default'>
<div class='panel-heading center'>
<%= image_tag @thing.image.url(:medium) %>
</div>
<div class='panel-body'>
<p>
<strong><%= @thing.title %></strong>
</p>
<p>
<%= @thing.description %>
</p>
<p>
<%= @thing.user.email %>
</p>
<% if @thing.user == current_user %>
<%= link_to 'Edit', edit_thing_path(@thing) %>
<% end %>
</div>
</div>
</div>
回答by Zim
You can use the Bootstrap text-centerclass.
您可以使用 Bootstraptext-center类。
<div class="row">
<div class="col-md-offset-2 col-md-8">
<div class="panel panel-default">
<div class="panel-heading text-center">
..
</div>
<div class="panel-body">
..
</div>
</div>
</div>
</div>
Demo: http://bootply.com/97325
回答by grimmus
Here's the answer i put in the comment :)
这是我在评论中的答案:)
Try adding text-center class instead of center. An image is an inline element so will understand the text-align:center style.
尝试添加 text-center 类而不是 center。图像是内联元素，因此将理解 text-align:center 样式。
