Foundation-interchange-media-queries

名前付きメディアクエリの交換

説明

SASSの_ $ breakpoints_変数では、いくつかのキーワードとともにブレークポイントを定義できます。 完全なCSSメディアクエリの名前付きクエリの省略形としてサポートします。

独自の名前付きメディアクエリを含め、それらをプロパティとして Foundation.Interchange.SPECIAL_QUERIES に追加できます。

Foundation.Interchange.SPECIAL_QUERIES['square'] = 'screen and (aspect-ratio: 1/1)';

Sr.No.	Query Name	Media Query
1	small	screen and (min-width: 0em)
2	medium	only screen and (min-width: 40em)
3	large	only screen and (min-width: 64em)
4	xlarge	only screen and (min-width: 75em)
5	xxlarge	only screen and (min-width: 90em)
6	portrait	screen and (orientation: portrait)
7	landscape	screen and (orientation: landscape)
8	retina	only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)