CSS最后一个孩子不适合我

-2

我尝试学习每一天，我发现一个教程，其中老师从列表组项目中选择第一个孩子来改变颜色。CSS最后一个孩子不适合我

我想玩这个，并从list-group-item中选择最后一个：child，以更改文本修饰规则，仅用于span（更多），但不起作用。随着CSS，我也放在这里，更多的单词不加下划线。

我该怎么办？

.list-group-item { 
 
     padding: 0px; 
 
     margin-left: 20px; 
 
    } 
 
    .list-group-item:last-child { 
 
     text-decoration: underline; 
 
    }

<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<title></title> 
 
<link href="style.css"> 
 
</head> 
 
<body> 
 
<div class="sidebar"> 
 
     <div class="row"> 
 
     <div class="sidebar-inner "> 
 
      <div class="list-group"> 
 
      <div class="list-group-item"> 
 
       <div class="float-left imageIcon"> 
 
       <img src="../images/sidebar_icon" class="img-responsive" alt="Icon"> 
 
       </div> 
 
       <div class="float-right textDesc"> 
 
       <h4 class="list-group-item-heading">My Title</h4> 
 
       <p class="list-group-item-text">Description</p> 
 
       </div> 
 
      </div> 
 
      <div class="list-group-item"> 
 
       <span>More...</span> 
 
      </div> 
 
      </div> 
 
      <div class="list-group"> 
 
      <div class="list-group-item"> 
 
       <div class="float-left imageIcon"> 
 
       <img src="../images/sidebar_icon" class="img-responsive" alt="Icon"> 
 
       </div> 
 
       <div class="float-right textDesc"> 
 
       <h4 class="list-group-item-heading">My Title</h4> 
 
       <p class="list-group-item-text">Description</p> 
 
       </div> 
 
      </div> 
 
      <div class="list-group-item"> 
 
       <span>More...</span> 
 
      </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</body> 
 
</html>

来源

2017-06-25 John Smith

其中UR写入此样式的CSS或在文件的style.css – Hussain

添加REFFERENCE在HTML该文件。 ..并清理解决方案运行 –

PLZ HTML – Hussain

应该是text-decoration: underline;不text-decoration: underlined;。

编辑：添加一个片段：

.list-group-item { 
 
\t padding: 0px; 
 
\t margin-left: 20px; 
 
} 
 
.list-group-item:last-child { 
 
\t text-decoration: underline; 
 
}

<div class="sidebar"> 
 
\t <div class="row"> 
 
\t \t <div class="sidebar-inner "> 
 
\t \t \t <div class="list-group"> 
 
\t \t \t \t <div class="list-group-item"> 
 
\t \t \t \t \t <div class="float-left imageIcon"> 
 
\t \t \t \t \t \t <img src="../images/sidebar_icon" class="img-responsive" alt="Icon"> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t \t <div class="float-right textDesc"> 
 
\t \t \t \t \t \t <h4 class="list-group-item-heading">My Title</h4> 
 
\t \t \t \t \t \t <p class="list-group-item-text">Description</p> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="list-group-item"> 
 
\t \t \t \t \t <span>More...</span> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t \t <div class="list-group"> 
 
\t \t \t \t <div class="list-group-item"> 
 
\t \t \t \t \t <div class="float-left imageIcon"> 
 
\t \t \t \t \t \t <img src="../images/sidebar_icon" class="img-responsive" alt="Icon"> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t \t <div class="float-right textDesc"> 
 
\t \t \t \t \t \t <h4 class="list-group-item-heading">My Title</h4> 
 
\t \t \t \t \t \t <p class="list-group-item-text">Description</p> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="list-group-item"> 
 
\t \t \t \t \t <span>More...</span> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div>

来源

2017-06-25 16:12:09

O，我明白了，但仍然无效。我看不到更多的下划线。我得到整个箱子.list-group-item下划线现在:) –

我已经添加了一个片段，它似乎为我工作。 –

谢谢@ MD5HashBrowns :)。 –

CSS最后一个孩子不适合我

回答

相关问题