Question

所以我在一个正在研究的项目上遇到了一些问题。在我正在设计的网站上，一切都运行良好，直到我注意到我需要从我的CSS上的img标签更改为类或id标签，以便单独设置它们。当试图将其切换时，它完全忽略了我编写的CSS代码，它在img标记下工作正常。我究竟做错了什么？感谢

HTML：

<div class="me_photo">
    <img src="../../Portfolio Icons/photo_of_me.jpg" alt="Photo of me">
</div>

CSS：

.me_photo {
    width: auto;
    height: 250px;
    margin-left: 45px;
    border: solid 5px;
    border-color: white;
    display: inline-block;
    margin-right: 45px;
    vertical-align: top;
}

输出：

img

class

Answer 1

我认为问题在于你的目标是错误的元素。您使用的选择器与容器div匹配，而不是img。

试试这个：

＆＃13;

.me_photo > img {
  width: auto;
  height: 250px;
  margin-left: 45px;
  border: solid 5px;
  border-color: white;
  display: inline-block;
  margin-right: 45px;
  vertical-align: top;
}

＆＃13;

<div class="me_photo">
  <img src="../../Portfolio Icons/photo_of_me.jpg" alt="Photo of me">
</div>

＆＃13;

Answer 2

更改您的css代码=＆gt; .me_photo me {}

.me_photo img {
    width: auto;
    height: 250px;
    margin-left: 45px;
    border: solid 5px;
    border-color: gray;
    display: inline-block;
    margin-right: 45px;
    vertical-align: top;
}

<div class="me_photo">
    <img src="https://www.w3schools.com/w3images/fjords.jpg" alt="Photo of me">
</div>

从element标记更改为class / id标记时，CSS不加载

2 个答案: