Question

我需要帮助才能让文字站在同一级别的图像右侧我有这个

<a class="following-row" href="index-2.html?pid=2306">
                    <img alt="Girls logo" src="photos/users/35257/resized/9fd79de3589edff68db18bb6141025c3.jpg">
                    <span class="following-row-text">Girls<span class="item-details"> · 78 followers</span></span>
                </a>

我无法拥有一套正确的css样式，可以满足我的需求，我需要帮助。

感谢

Answer 1

<div>
  <img style="vertical-align:middle" src="http://cdn.jssor.com/demos/img/icons/icon_chrome.png">
  <span style="">Girls · 78 followers</span>
</div>

检查此代码段

Answer 2

根据评论更新了答案。

a.wrapper img {
  cursor: pointer;
  width: 100px;
  height: 100px;
  vertical-align: middle;
  text-decoration: none;
}
a.wrapper span {
  padding-left: 10px;
  cursor: pointer;
}
a.wrapper:hover img {
  margin: -1px;
  border: 1px solid red;
}
a.wrapper:hover span {
  color: red;
}

<a hre="#" class="wrapper">
  <img src="http://pipsum.com/100x100.jpg" alt="Image">
  <span>Girls · 78 followers</span>
</a>

如何使用html和css使文本站在图像的右侧

2 个答案: