无法读取CSS进行图像布局

Question

我是CSS和HTML的新手。我将添加logo以下代码的类添加到我们的CSS页面中：

logo {
  position: absolute;
  top: 0px;
  left: 0px;
  height: auto;
  width: 0%;
}

那是指以下HTML类：

<img src="${pageContext.request.contextPath}/assets/images/Catlogo.jpg" 
     alt="Caterpillar logo" width="115" height="50" class="logo">

包括整个父容器：

<nav class="navbar navbar-expand navbar-dark bg-dark static-top">

    <img src="${pageContext.request.contextPath}/assets/images/Catlogo.jpg" alt="Caterpillar logo" 
        width="115" height="50" class="logo">

    <a class="navbar-brand mr-1" href="pservlet">[Offer To Sell] Grief Reconciliation</a>

    <button class="btn btn-link btn-sm text-white order-1 order-sm-0"
        id="sidebarToggle" href="#">
        <i class="fas fa-bars"></i>
    </button>

但是，即使具有CSS引用，导航栏中的图片也不会改变。本质上，我只是在尝试锚定图像（请参阅下面的屏幕截图）

我究竟做错了什么？

Answer 1

在CSS中，类引用应以前置句号标记.logo。您将需要如下修改css类

.logo {
  position: absolute;
  top: 0px;
  left: 0px;
  height: auto;
  width: 0%;
}

<img src="Catlogo.jpg" alt="Caterpillar logo" width="115" height="50" class="logo">