Question

为什么我不能更改背景或对nth-child(2nd)做class="oneItem"。

<% include ../partials/header%>

<h1 class="total"><strong>$</strong> <span class="totalColor"><%= usr[0].total%></span> </h1>
<a class="budButton" href="/budget">Create</a>
<div class="allItemsTable">
  <div class="container">
      <div class="col-md-6 ">

          <div class="rightExp">
            <% last.forEach(function(itemsAll){%>
            <% if(itemsAll.expInc==="inc"){%>

            <div class="oneItem">
              <div class="myone">
                <div class="col-md-5 col-sm-6 col-xs-5 ">
                  <span class="itemDec"><strong><%= itemsAll.item%></strong></span>
                </div>

                <div class="col-md-2 col-sm-2 col-xs-2">
                  <span class="dolarColor"><strong>$</strong></span><%= itemsAll.value%>
                </div>

                <div class="col-md-3 col-sm-3 col-xs-3">
                  <span class="dateDec">
                    <%= itemsAll.created.toDateString().split(' ').slice(1).join(' ').toUpperCase() %>
                  </span>
                </div>
                <div class="col-md-1 col-sm-1 col-xs-1">
                  <form class="lineOne" action="/all/<%=itemsAll._id%>?_method=DELETE" method="post">
                    <button class="formButtonItem"><i class="fa fa-trash" aria-hidden="true"></i></button>
                  </form>
                </div>
              </div>
            </div>

            <% }%>
            <% })%>
          </div>

      </div>
      <div class="col-md-6 ">
          <div class="rightExp">
            <% last.forEach(function(itemsAll){%>
            <% if(itemsAll.expInc==="exp"){%>
            <div class="oneItem">
              <div class="col-md-5 col-sm-6 col-xs-5 ">
                <span class="itemDec"><strong><%= itemsAll.item%></strong></span>
              </div>
              <div class="col-md-2 col-sm-2 col-xs-2">
                <span class="dolarColor"><strong>$</strong></span><%= itemsAll.value%>
              </div>

              <div class="col-md-3 col-sm-3 col-xs-3">
                <span class="dateDec"><%= itemsAll.created.toDateString().split(' ').slice(1).join(' ').toUpperCase() %> </span>
              </div>
              <div class="col-md-1 col-sm-1 col-xs-1">
                <form class="lineOne" action="/all/<%=itemsAll._id%>?_method=DELETE" method="post">
                  <button class="formButtonItem"><i class="fa fa-trash" aria-hidden="true"></i></button>
                </form>
              </div>
            </div>
            <% }%>
            <% })%>
          </div>
      </div>
  </div>
</div>

<% include ../partials/footer%>

这是css文件

.allItemsTable{
  margin-top: 120px;
}

.oneItem{
  font-family: 'Julius Sans One', sans-serif;

}


.dolarColor{
  color:rgb(2, 173, 48)
}
.rightExp{
  font-size: 20px;
}
.itemDec{
  text-transform: uppercase;
}
.dateDec{
  font-family: 'Abel', sans-serif;
  color:gray;
}


.formButtonItem{
  background-color: white;
  border:none;
  color: black;
  padding: 3px 15px;
  text-align: center;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
  margin-right: 0;
  width: 80px;
  opacity: 0.5;

}
.formButtonItem:hover{
  background-color: red;
  border:none;
  color: white;
  padding: 3px 15px;
  text-align: center;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
  margin-right: 0;
  width: 80px;
  transition-delay: 0.1s;
  transition-duration: 0.5s
}

Answer 1

.allItemsTable .oneItem:nth-child(2) {}

第n个孩子的问题

1 个答案: