html - 我怎样才能使 DIV 中的第一个元素具有与其他元素不同的 CSS？

Question

我有以下 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%;
            }

        }
    }

我怎样才能使外部容器内的第一个模态输入行在顶部没有填充？

Answer 1

使用:first-child伪类

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

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

    ...

}