在bootstrap中使用了`col-sm-4`这样的类名为什么没有用？-灵析社区

在bootstrap中使用了`col-sm-4`这样的类名为什么没有用？ 使用的是官网上提供的[模板](https://link.segmentfault.com/?enc=PpwADyKiCCrSs7ggcuk2rw%3D%3D.X3aXfx6tlz80UF4pq8yUoFb9pl%2BjfUoF0Rh9T749GY4%2BkJFUCwM2BF2E3J5Zdxt2kw633pF5gAtTGTqzQPFpCg%3D%3D)搭建的环境 猜测是没有导入某一个模块，然后我就查看了`col-sm-4`这样的类名是怎么定义和导入的。 // myProject/scss/style.css @import "bootstrap/scss/grid"; 可见，我们导入了栅格系统模块。 // myProject/node_modules/bootstrap/_grid.css @if $enable-grid-classes { @include make-grid-columns(); } * `$enable-grid-classes`定义在_variable.scss中，并且值为`true` * `make-grid-columns` mixin定义了`.col-{}-{}`这样的类名。 // myProject/node_modules/bootstrap/mixins/_grid.css @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) { @each $breakpoint in map-keys($breakpoints) { $infix: breakpoint-infix($breakpoint, $breakpoints); @include media-breakpoint-up($breakpoint, $breakpoints) { // Provide basic `.col-{bp}` classes for equal-width flexbox columns .col#{$infix} { flex: 1 0 0%; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4 } .row-cols#{$infix}-auto > * { @include make-col-auto(); } @if $grid-row-columns > 0 { @for $i from 1 through $grid-row-columns { .row-cols#{$infix}-#{$i} { @include row-cols($i); } } } .col#{$infix}-auto { @include make-col-auto(); } @if $columns > 0 { @for $i from 1 through $columns { .col#{$infix}-#{$i} { @include make-col($i, $columns); } } // `$columns - 1` because offsetting by the width of an entire row isn't possible @for $i from 0 through ($columns - 1) { @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0 .offset#{$infix}-#{$i} { @include make-col-offset($i, $columns); } } } } 在这里我们定义了形如`.col#{$infix}`,` .col#{$infix}-#{$i}`的类名。但是当我们使用这些类名的时候发现被没有任何的效果。