html - 如何使DIV中的第一个元素具有与其他元素不同的CSS？

我有以下LESS代码：

.modal-input-row {
        padding-bottom: 1rem;
        padding-top: 1rem;
        overflow: hidden;
        display: block;

        div {
            float: left;
            width: 50%;

            input {
                box-sizing: border-box;
                margin-bottom: 0.1rem;
                width: 75%;
            }

        }
    }

如何使外部容器内的第一个模式输入行在顶部没有填充？

最佳答案

使用:first-child伪类

.outercontainer .modal-input-row {
    padding-bottom: 1rem;
    padding-top: 1rem;
    overflow: hidden;
    display: block;

    &:first-child {
       padding-top: 0;
    }

    ...

}