Sass and SCSS

  1. Reusability and Abstraction
    1. Mixins
      1. Defining a Mixin
        1. `@mixin` Directive
          1. Mixin Structure
          2. Including a Mixin
            1. `@include` Directive
            2. Passing Arguments to Mixins
              1. Positional Arguments
                1. Keyword Arguments
                  1. Default Values for Arguments
                    1. Variable Arguments
                    2. Passing Content Blocks
                      1. `@content` Directive
                        1. Yielding Nested Content
                      2. Inheritance with `@extend`
                        1. The `@extend` Directive
                          1. Syntax and Usage
                          2. Placeholder Selectors
                            1. Defining Placeholders
                              1. Using Placeholders with `@extend`
                              2. How `@extend` Works
                                1. Selector Grouping
                                  1. Output in Compiled CSS
                                  2. Potential Pitfalls of `@extend`
                                    1. Specificity Issues
                                      1. Unintended Selector Grouping
                                    2. Comparing Mixins and Extends
                                      1. When to Use `@mixin`
                                        1. When to Use `@extend`
                                          1. Performance and Output Considerations

                                        Previous

                                        4. Core Sass Features

                                        Go to top

                                        Next

                                        6. Sass Data Types