html - 更改 div 类中特定元素的 CSS 属性

Question

我试图让有关图像的文本移动到图像的右侧而不是图像下方，我一直在尝试使用 float: right，但这会移动所有div 类中的元素称为信息，因此我想知道是否有一种方法可以将 CSS 格式应用于 div 类的特定元素？

.info {
  color: #eaeaea;
}

<div class="info">
  <h3>Info</h3>
  <img src="img.jpg" alt="Image" width="70px" height="113px">
  <p>Information on the image
    <p>
</div>

Answer 1

这里最重要的是选择 img，然后将其向左浮动，这样右边的文本将围绕 img float 。 .选择 <div> 中的元素与类(class)名称 .info ，只需在空格后添加即可

.info img {float: left}

.info {
  color: #888;
  width: 250px;
}
.info img {
  float: left;
  margin-right: 20px;
}

<div class="info">
  <h3>Info</h3>
  <img src="http://via.placeholder.com/70x113" alt="Image">
  <p>Dolor blanditiis cum obcaecati quibusdam mollitia modi. Accusamus error culpa quaerat aliquam doloremque Deserunt sit vel corrupti repellat quod animli est impedit? Adipisci sit magni recusandae quod quaerat.<p>
</div>