Question

我想将文本和图像并排放置。现在，文本在图像的左侧。要向右移动文本，我可以更改

的位置

<aside>

如何将图像向左移动？

<aside style="background-image: url(img/s-esh_spectrogram.jpg);"> </aside>

Answer 1

在各个部分周围设置包装器，并在其上设置CSS属性display: flex。
进一步阅读：https://www.w3schools.com/css/css3_flexbox.asp

.wrapper {
  display: flex;
}

section.text-section {
  height:     300px;
  width:      60%;
  background: #82fcf5;
}

aside.image-section {
  height:     300px;
  width:      40%;
  background: #c8fc55;
}

<div class="wrapper">

  <aside class="image-section" style="background-image: url(img/s-esh_spectrogram.jpg);">
    <p>Image here...</p>
  </aside>

  <section class="text-section">
    <p>Text here...</p>
  </section>

</div>

将图像放置在屏幕左侧<aside>

1 个答案: