scss nesting wording is a lot of convenience, but the problem is caused by a heavy increase the weight, if you want to modify a style by DOM will find that you want to modify the style is always original cover, do not think, certainly weight value is not enough, but do not want to use !important, then the solution way is to use scss of the @at-rootdirective, which can then your style output on the root level of the document rather than nested under the symbol selector, so that other ways to modify styles do not worry about the style of the original weight value is too high and does not work.
Compile the results
here only .middle-leftis output to the root level, but .left-contentdo not use this instruction, .left-contentor output .middle-leftunder
