css - last-child不起作用

问题描述

问 题

<div id="taskContainer" style="display: block;">


        <table class="table table-bordered table-hover" id="taskTable" cellpadding="0" cellspacing="0">
            <thead>
            <tr>
                <th>任务执行人</th>
                <th>完成状态</th>
                <th>完成时间</th>
            </tr>
            </thead>
            <tbody id="taskTableBody">
            @{
            var listExecution = Model.listtaskexecution;
            if (listExecution != null && listExecution.Count > 0)
            {
            foreach (var item in Model.listtaskexecution)
            {
            <tr>
                <td>@(item.executbyname == null ? "" : item.executbyname)</td>
                <td>@(item.executon == null ? "待完成" : "已完成")</td>

                <td>@(item.executon)</td>
            </tr>
            }
            }
            }
            </tbody>
        </table>

        @{
        if (Model.listtaskexecution != null && Model.listtaskexecution.Count > 0)
        {
        foreach (var exectionItem in Model.listtaskexecution)
        {
        <div class="clearfix" style="margin-top:2rem; margin-bottom: 1em;">
            <div class="operatorDetail">
                <div class="left operatorImg">
                    <img class=".left" src="@exectionItem.avatar">
                </div>
                <div class="left operatorContent">
                    <div class="operatorInfo">
                        <h3>
                            @exectionItem.executbyname
                        </h3>
                        <p>
                            @exectionItem.executon
                        </p>
                    </div>
                    <p>@exectionItem.executiondescription</p>

                        @{
                        if (exectionItem.listimgurl != null && exectionItem.listimgurl.Count > 0)
                        {
                        foreach (var imgItem in exectionItem.listimgurl)
                        {
                    <div class="itemImg left">
                        <img src="@imgItem"/>
                    </div>

                    }
                        }

                        }
                </div>
            </div>


        </div>
        }

        }

        }
    </div>

#taskContainer .operatorDetail:nth-last-child(1){
  border-bottom:none;
}

全选出了了啊 为什么啊

这个问题已被关闭，原因：问题已解决 - 问题已解决，且对他人无借鉴意义

解决方案

The :nth-last-child(an+b) CSS pseudo-class matches an element that has an+b-1 siblings after it in the document tree, for a given positive or zero value for n, and has a parent element.

先看定义，nth 这种都是选择同级别最后一个元素。但是看你的结构是这样的：

.clearfix>.operatorDetail
.clearfix>.operatorDetail
.clearfix>.operatorDetail

目标元素 .operatorDetail 都没有兄弟节点，是唯一一个，也就是全都是最后一个。所以就全被选中了。

这篇关于css - last-child不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！