如何检查列表标签的数量

问题描述 投票:0回答:1

我有一个项目,在改变风格之前是很好的,但是在给#container添加阴影之后,它给了我这个来自分级器的消息。

The trading card page has a list of new facts
Each fact should have a corresponding label: expected 4 to equal 8

我做错了什么?

下面是卡片.html。

<!DOCTYPE html>
    <html>

    <head>
      <meta charset="utf-8">
      <title>Building the Prototype</title>
      <link rel="stylesheet" href="styles.css">
    </head>

    <body>
      <div id="container">
        <h1>Panda</h1>
        <!-- photo credit: wikipedia.org, image taken by Ritik -->
        <img src="https://c402277.ssl.cf1.rackcdn.com/photos/18315/images/hero_full/Medium_WW230176.jpg?1576168323" alt="panda">
        <div id="card" class="animal-info">
          <p id="interesting-fact">Pandas live mainly in temperate forests high in the mountains of southwest China, where they subsist almost entirely on bamboo. They must eat around 26 to 84 pounds of it every day, depending on what part of the bamboo they are eating. They use their enlarged wrist bones that function as opposable thumbs.</p>
          <ul id="facts">
            <li>
              <span class="lable">Scientific Name</span>: <span class="value">Ailuropoda melanoleuca</span>
            </li>
            <li>
              <span class="lable">Average Length</span>: <span class="value">4 to 5 feet</span>
            </li>
            <li>
              <span class="lable">Average Lifespan</span>: <span class="value">20 years</span>
            </li>
            <li>
              <span class="lable">Habitat</span>: <span class="value">Eating in a relaxed sitting posture</span>
            </li>
          </ul>
          <p id="summary">A newborn panda is about the size of a stick of butter—about 1/900th the size of its mother—but females can grow up to about 200 pounds, while males can grow up to about 300 pounds as adults. These bears are excellent tree climbers despite their bulk.
          </p>
        </div>
      </div>
    </body>

    </html>

这里是 styles. css:

#container{
    width: 513;
    height: 796;
    object-fit: contain;
    border: 1px solid #e0e0e0;
    box-shadow: 0 5px 5px 5px #e0e0e0;
    padding: 20px;
    font-family: sans-serif;
}


#container  img {
    width: 300px;
    height: auto;
    border: 1px solid #e0e0e0;
    padding: 1px;
}

#container h1{
    padding: 20px;
}

#card #interesting-fact {
    font-style: italic;
}

.animal-info{
}

#facts .lable {
    font-weight: bold;
}

#facts .value{
    font-style: italic;
}

#card ul {
    list-style-type: none;
}

#card {
    border: 1px solid #e0e0e0;
    padding: 20px;
}
html css html-lists
1个回答
0
投票

好吧......我不得不把列表的值没有 <span class="value"></span> 就是这样:)

© www.soinside.com 2019 - 2024. All rights reserved.