Question

我是html的新手，这是我的代码：

.social-media {
  height: 100px;
  width: 100px;
  border-radius: 25px;
}

<div class="social-media">
  <a href="https://twitter.com/mytwitter" target="_blank">
    <img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter">
  </a>
</div>

推特图片没有从css改变

Answer 1

试试这个：

  .social-media img {
     height: 100px;
     width: 100px;
     border-radius: 25px;
  }

Answer 2

为图像添加单独样式，使其占据父级的全宽

＆＃13;

 <div class="social-media">
  <a href="https://twitter.com/mytwitter" target="_blank"><img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter"></a>
</div>

＆＃13;

{{1}}

＆＃13;

Answer 3

您的css没有直接定位图片：

为您的图片提供ID或类，以便您专门定位

.social-media-image {
  height: 100px;
  width: 100px;
  border-radius: 25px;
}

<div class="social-media">
  <a href="https://twitter.com/mytwitter" target="_blank">
    <img class="social-media-image" src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter">
  </a>
</div>

您可以直接从社交媒体类

.social-media img {
  height: 100px;
  width: 100px;
  border-radius: 25px;
}

<div class="social-media">
  <a href="https://twitter.com/mytwitter" target="_blank">
    <img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter">
  </a>
</div>

查看link 了解css选择器的工作方式

为什么我的图片不遵循div类？

3 个答案: