動画で基礎を学ぶ!

会員限定 @mixin / @include

この学習動画は

会員限定!

月額¥11,000税込/月
今だけ30日間無料で使い放題!

会員登録はこちら

@mixin/@includeについて

@mixinと@includeはSCSSでコード再利用を効率化する機能です。
@mixinでスタイルを定義し、@includeで適用することで、重複を減らし保守性を向上させます。

@mixinとは?

@mixinは、よく使うスタイルのセットを「ミックスイン」という形でまとめて定義する機能です。
これにより、同じスタイルを何度も書かずに再利用できるため、効率的なコーディングが可能になります。

例:button-stylesという名前で定義
@mixin button-styles {
  padding: 10px 20px;
  background-color: #3498db;
  color: white;
  border-radius: 5px;
}
このように、@mixinの後に名前を指定し、{}内にスタイルを記述します。

@includeとは?

この学習動画 / コンテンツの続きは

会員限定!

月額¥11,000税込/月
今だけ30日間無料で使い放題!

会員登録はこちら

Sassコーディング

全 9 動画
  • 会員限定Sassとは

    04:26
  • 会員限定ターミナルについて

    05:08
  • 会員限定Sassのインストール

    04:42
  • 会員限定Sassの書き方

    02:35
  • 会員限定ブラウザで表示

    01:58
  • 会員限定変数

    03:38
  • 会員限定@mixin / @include

    03:27
  • 会員限定@extend

    03:51
  • 会員限定演算

    02:54