吉本集の個人ブログ
Web制作の技術について書いています。たまに日記も書きます。

@if : 条件分岐で使用できる演算子

2014年3月1日 / category : reference-sass, sass

条件分岐で使用できる演算子は、下記の通りです。

条件分岐で使用できる演算子の種類

Sass
/*
and : かつ
*/
@if $isFlagA and $isFlagB{
	.classA{
		margin: 0;
	}
}

/*
or : または
*/
@if $isFlagA or $isFlagB{
	.classB{
		margin: 0;
	}
}

/*
not : 否定
*/
@if not $isFlagA{
	.classC{
		margin: 0;
	}
}

/*
A == B : AとBは等しい
*/
@if $isFlagA == $isFlagB{
	.classD{
		margin: 0;
	}
}

/*
A != B : AとBは等しくない
*/
@if $isFlagA != $isFlagB{
	.classE{
		margin: 0;
	}
}

/*
A > B : AはBより大きい
*/
@if $numA > $numB{
	.classF{
		margin: 0;
	}
}

/*
A < B : AはBより小さい
*/
@if $numA < $numB{
	.classG{
		margin: 0
	}
}

/*
A >= B : AはB以上
*/
@if $numA >= $numB{
	.classH{
		margin: 0;
	}
}

/*
A <= B : AはB以下
*/
@if $numA <= $numB{
	.classI{
		margin: 0;
	}
}