Question

目前，我使用的框架使用经典的clearfix：

@mixin clearfix {
    zoom: 1;

    &::before,
    &::after {
        content: '';
        display: table;
    }

    &::after {
        clear: both;
    }
}

我想知道现在不再支持IE7是否可以放弃使用::before，这样我就可以清除一个可能还需要伪元素装饰的元素目的。我的建议是将其转化为以下内容：

@mixin clearfix {
    &::after {
        clear: both;
        content: '';
        display: table;
    }
}

据我所知，这将与::before一样有效，但我想在做出改变之前做出绝对肯定，因为这会影响成千上万的用户，如果我弄错了，我不想成为那个人。

提前致谢！

Answer 1

我决定修改mixin，以便我可以在cue上使用简单版本，否则允许它默认为当前版本。

我也注意到IE8也没有得到支持，因为伪冒号使用了双冒号，所以我在那里也固定了...

@mixin clear-fix($simple: false) {
    @if $simple != true {
        zoom: 1;

        &:before,
        &:after {
            content: '';
            display: table;
        }

        &:after {
            clear: both;
        }
    }
    @else {
        &::after {
            clear: both;
            content: '';
            display: table;
        }
    }
}

用法：

@include clear-fix; // prints out old-skool :before/:after with IE7/8 support

@include clear-fix(true); // prints out simple ::after method

将:: fix之前和:: afterfix更新为一个简单的::之后是否安全？

1 个答案: