scoped私有化样式

将当前模块(页面)的样式仅仅运用在当前,有效实现多页面样式隔离,实现各自功能互不干扰。

<style scoped>
.avatar-uploader { height: 100px; }
.el-step.is-simple .el-step__title { font-size: 14px; }
.el-form-item { margin-bottom: 20px; }
.el-input { width: 500px; }
</style>

框架样式重设

使用框架时必然会遇到需要重设框架样式的问题,比如:element.js 框架,使用 >>> 来重设框架样式。

.config { border-left: 0px solid #eee; animation: slideInRight .2s ease; }
.config >>> .el-tabs__item { width: 50%; text-align: center; }
.config >>> .el-tabs__nav { width: 100%; float: none; }
.config >>> .el-tabs__header { margin-bottom: 0; }
.config >>> .el-upload { display: block; }

 

Logo

前往低代码交流专区

更多推荐