html - 使图像定位在其他元素上

标签 html css twitter-bootstrap layout

我需要使图像定位如下图:

enter image description here

我有代码:

<footer>
    <div class="stopka1">
        <div class="container">
            ....................
            </p>
            <a href="#top"></a>
        </div>
    </div>
</footer>

<div class="container">
    <div class="row" style="padding-right:0; padding-left:0;padding-top:30px;padding-bottom:20px;">
        <div class="col-md-6">
            <div class="row">
                <div class="col-xs-6"><img src="phone.png" style="vertical-align:middle !important;"> <span style="font-weight:lighter;color:rgb(10, 55, 110);font-size: 28px; vertical-align:middle !important;">22 213 18 31</span></div>
                <div class="col-xs-6"><a href="" style="width:100%;"><button class="col-cs-12 przycisk-pytanie" style="font-weight: bold;margin-top:0;">Zadaj pytanie</button></a></div>
            </div>
        </div>      
        <div class="col-md-6">
            <div class="row">
                <div class="col-xs-2"><img src="women.png" style=""></div>
                <div class="col-xs-5">.. price ..</div>
                <div class="col-xs-5"><a href="" style="width:100%;"><button class="przycisk-rezerwuj-big" style="font-weight: bold;height:35px;">Rezerwuj teraz</button></a></div>
            </div>
        </div>  
    </div>
</div>

有人知道如何获得这种效果吗?我不知道如何强制它覆盖更高的 div。

最佳答案

您可以选择以下两个选项之一:

选项 1

img {margin-top:-20px;}

选项 2

img {position:relative; top:-20px;}

关于html - 使图像定位在其他元素上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33917004/

相关文章:

javascript - 可以将 Ng-repeat 与省略号一起使用

c# - 将 Bootstrap 设计添加到网络表单

javascript - html 表单 : input requierd if Select>optinon selected

JavaScript 创建元素然后添加一个事件

css - 在 htaccess 中使用 RewriteRule 后,在 html 中使用时不会加载相对路径

javascript - Bootstrap 切换菜单加载失败

javascript - 少任务未找到错误

html - font awesome 在具有自定义类和行类的 div 中显示不佳

html - 如何使用 ant design 在 ReactJS 中将半圆蒙版应用于图像并在图像内添加按钮?

html - 如何修复此元素以使其在滚动时停留在页面顶部?