Question

我设计了一个脚本，然后我制作了一个可以看到照片的部分。但是我想在照片上放一个广告，让这个广告响应桌面和手机，这里是截图：

https://prnt.sc/ijbh4t

这里是我在本节试过的代码：

  <section class="fullwidth-single-video">
    <div class="row" style="display: flex; justify-content: center;">
    <div class="large-8 columns">
<img src="http://xsscoder.com/QatarNews/img.png" style="width: 100%;"> code of the advertisment here
    </div>
    </section>

问题是广告显示在照片下方而不是照片中间。

Answer 1

试试这段代码：

<section class="fullwidth-single-video">
        <div class="row" style="display: flex; justify-content: center;">
            <div class="large-8 columns" style="position: relative;">
                <img src="http://xsscoder.com/QatarNews/img.png" style="width: 100%;"> 
                    <p style="position: absolute; top: 20%; margin: 0; width: 100%; text-align: center; background-color: #fff; padding: 5px;">code of the advertisment here</p>
            </div>
        </div>
    </section>

在图像上放置div文本并使其响应

1 个答案: