それではヘッダ周りを調整していきます。 ヘッダーの構造 _sのヘッダ(site-headerクラス)は、site-brandingクラスとmain-navigationクラスで構成されています。 //header […]
SCSS
SassでFont Awesomeを使う
CSSで色やサイズを指定することができるアイコンフォントで有名なFont Awesome。Font Awesomeには「このアイコンどんなときに使うの?」と言いたくなるようなアイコンを含め4,566種のアイコンを提供して […]
Sassでよく使うmixinまとめ
Sassを書き始めるときにいつも引っ張り出してくるmixinをメモ。よく使うものなので、再利用できるようmixinにしておくとすごく便利。 mixinについてはこちらをご覧ください。→ Sassで@mixin 要素内のテ […]
Sassで@mixin
@mixin(ミックスイン)を使えば、あるスタイルを定義したルールセットの内容を継承しつつ、新しいルールセットを作ることができる。 ここまでは@extendと同じだが、 @mixinは引数を指定して定義した @mixi […]
Sassの変数と演算
Sassでも変数を定義することで、任意の場所で呼び出すことができる。 変数は「$変数名:値; → $mainColor: #3a86e0;」という形で宣言する。 変数とスコープ どのるルールセットにも属さない変数は、グロ […]
Sassで@extend
@extendを使えば、あるスタイルを定義したルールセットの内容を継承しつつプロパティを追加・変更して、新しいルールセットを作ることができる。 @extendの使いどころ 共通するプロパティをひな形のルールセットにして、 […]