html - 如何使用内联 css 将图像移动到 div 的中心?

标签 html css

如何将图片移动到div的中心?

enter image description here

我尝试使用 text-align:center,但它不起作用。

谁能给我一个快速提示?非常感谢我:)!

<!-- Logo -->
@if( $user->logo_path)
<img class=" img-rounded" style="text-align:center;" src="/files/logo_path/{{$user->id}}" alt="logo" width="100" >   
@else
<img class=" img-rounded " style="text-align:center;" src="/img/default.PNG" alt="logo"  width="100" >
@endif

最佳答案

您需要申请 text-align:center < img > 的父 div 属性元素,前提是您的 < img >元素没有任何类型的定位。

确保 < img >元素没有 display:block属性,如果确实如此,则将其更改为 display:inlinedisplay:inline-block

HTML:

<div class="parent_div" style="text-align:center;">
    <!-- Logo -->
    @if( $user->logo_path)
    <img class=" img-rounded" src="/files/logo_path/{{$user->id}}" alt="logo" width="100" >   
    @else
    <img class=" img-rounded " src="/img/default.PNG" alt="logo"  width="100" >
    @endif
</div>

关于html - 如何使用内联 css 将图像移动到 div 的中心?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27298235/

相关文章:

html - 使用iText,图像base64将html解析为pdf

css - Angular 7 : patching value of radio button Form Control does not update UI

html - 获取自定义导航栏下拉列表以正确对齐

javascript - 提交后输入值的颜色

javascript - 如何将转换后的文本字符串还原为原始 HTML 布局?

jquery - 动态分配 'active' 类

html - 如何在 HTML <table> 中的 <td> 元素中设置列?

html - 优化阴影渲染

javascript - 页面关闭时cookies不会被删除吗?

javascript - Knockout.js 将 2D 表与 rowspan 绑定(bind)