CSS如何选择所有子元素添加样式-创新互联

这篇文章主要为大家展示了CSS如何选择所有子元素添加样式,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带大家一起来研究并学习一下“CSS如何选择所有子元素添加样式”这篇文章吧。

我们提供的服务有:做网站、成都网站设计、微信公众号开发、网站优化、网站认证、岱岳ssl等。为1000多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的岱岳网站制作公司

方法:

以实际项目中less为例:

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

上面代码成功实现了 .lk-toolbar 下一切子元素的 margin-bottom: 20px

这么一来避免罗列各种可能出现的子元素类型,傻逼式操作:

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

应用场景(效果):

CSS如何选择所有子元素添加样式

感悟(废话):

一开始纳闷CSS中到底有没有这种选择全部子元素的选择器呢,后来看了下文档,发现虽然没有,但是最基本的方法人家已经告诉你了,剩下的就靠你自己的造化了(看你会不会变通使用!)

CSS如何选择所有子元素添加样式

以上就是关于“CSS如何选择所有子元素添加样式”的内容,如果改文章对你有所帮助并觉得写得不错,劳请分享给你的好友一起学习新知识,若想了解更多相关知识内容,请多多关注创新互联行业资讯频道。


当前标题:CSS如何选择所有子元素添加样式-创新互联
链接地址:http://pwwzsj.com/article/disdgi.html