読者です 読者をやめる 読者になる 読者になる

はしくれエンジニアもどきのメモ

情報・Web系技術の勉強メモ・備忘録です。

Sass

CSS のみで縞模様、水玉模様を作る

CSS のみで縞模様、水玉模様を作る CSSのみで、縦縞・横縞、水玉模様を作れることがわかったのでメモ。 参考にしたリンクはこちらです。 honttoni.blog74.fc2.com 目次 サンプル 縦縞・横縞・斜め縞 水玉 参考リンク サンプル 縞模様のサンプル codepen.io …

Compass でスプライト画像を作ってみる

Compass でスプライト画像を作ってみる Compass では、画像から自動でスプライト画像を作ってくれる。 実際に試してみたのでメモ。 目次 スプライト画像生成(自動クラス割り当て) マジックセレクタ スプライト画像生成(手動クラス割り当て) 参考リンク …

Compass インストール・プロジェクト設定・コンパイル

Compass インストール・プロジェクト設定・コンパイル Compass のインストール、新規プロジェクトの作成、プロジェクトの設定、コンパイルについてのメモです。 目次 Compass とは インストール環境 インストール 新規プロジェクトの作成 プロジェクトの設定…

Sass 応用(ファイル分割(@import)、関数(@function)、継承(@extend)、@mixin, @include, @content)

Sass 応用(ファイル分割(@import)、関数(@function)、継承(@extend)、@mixin, @include, @content) Sass の醍醐味であるファイル分割(@import)、関数(@function)、継承(@extend)、@mixin、@include、@content についてまとめておきます。 目次 ファイル分…

Sass の基本操作2(条件分岐、繰り返し、リスト)

Sass の基本操作2(条件分岐、繰り返し、リスト) Sassでは、一般的プログラミング言語にあるような 条件分岐、繰り返し、リストを扱うことができます。 目次 @if(条件分岐) @for(繰り返し) @while(繰り返し) リストと@each 参考リンク 関連リンク

Sassの基本操作(コメント文、ネスト、親セレクタの省略、演算、変数、標準で使える関数)

Sassの基本操作(コメント文、ネスト、親セレクタの省略、演算、変数、標準で使える関数) Sass の基本操作である、コメント文、ネスト、親セレクタの省略、演算、変数、標準で使える関数についてのメモです。 目次 コメント文 ネスト(nest) &(親セレクタの…

Sass のインストールとコンパイル(Windows)

Sass のインストールとコンパイル(Windows) 今更ながら、Sass を使い始めたので、Sass の基本的な使い方をメモしていきます。 今回はインストールについてです。 目次 Sass とは Ruby のインストール Sass のインストール Sass のバージョン確認 コンパイル…