How to select all child elements and add styles to them in CSS

method:

Take less in the actual project as an example:

.lk-toolbar {
    .el-input {
        width: 169px;
        margin-right: 10px;
    }
    > * {
        margin-bottom: 20px;
    }
}

The above code successfully implements the margin-bottom: 20px of all sub-elements under .lk-toolbar

This avoids the idiotic task of listing all possible sub-element types:

.lk-toolbar {
    .el-input {
        width: 169px;
        margin-right: 10px;
        margin-bottom: 20px;
    }
    .el-button, .el-date-editor {
        margin-bottom: 20px;
    }
}

Application scenarios (effects):

Insights (nonsense):

At first I wondered if there was such a selector in CSS to select all child elements. Later I looked at the documentation and found that although there was no such selector, the most basic method has been told to you, and the rest depends on your own luck (see if you can use it flexibly!)

Tutorial OS: "The methods are all here. It's up to you whether you can use them or not."

This concludes this article on how to select all child elements and add styles with CSS. For more information on adding styles to child elements with CSS, please search previous articles on 123WORDPRESS.COM or continue browsing the related articles below. We hope that everyone will support 123WORDPRESS.COM in the future!