CSS/MediaQueries をテンプレートにして作成

開始行:
*Media Queries ~ メディアクエリーとは、出力媒体の種類やサイズに応じて、適... ~ **メディアタイプ HTMLの link 要素・style 要素、CSS の @import、@media にお... -''all''：全デバイスに適用 -''screen''：ディスプレイに適用 -''print''：プリンタに適用 -speech：スピーチシンセサイザに適用 ： その他＞[[Google:html media属性]] ~ ***メディアタイプの記述例 -HTML link要素 <link rel="stylesheet" href="print.css" media="print"> -CSS @import @import url('print.css') print; -CSS @media @media print { nav{ display: none; } } ~ ~ **メディア特性 HTMLの link 要素・style 要素、CSS の @import、@media にお... -''max-width''：表示領域の最大幅（これ以下の場合に適用） -''min-width''：表示領域の最小幅（これ以上の場合に適用） -max-height：表示領域の最大高さ（これ以下の場合に適用） -min-height：表示領域の最小高さ（これ以上の場合に適用） -orientation：portrait（縦）/ landscape（横） -max-resolution：最大解像度（これ以下の場合に適用） -min-resolution：最小解像度（これ以上の場合に適用） ： その他＞ [[Google:CSS メディア特性]] ~ ***メディア特性の記述例 -HTML link要素 <link rel="stylesheet" href="mobile.css" media="screen ... -CSS @import @import url('mobile.css') screen and ( max-width:640px... -CSS @media @media screen and ( max-width:640px ) { nav{ display: none; } } ~ ~ 具体的な使用方法については [[ResponsiveDesign]] のページ... ~ ~

終了行:
*Media Queries ~ メディアクエリーとは、出力媒体の種類やサイズに応じて、適... ~ **メディアタイプ HTMLの link 要素・style 要素、CSS の @import、@media にお... -''all''：全デバイスに適用 -''screen''：ディスプレイに適用 -''print''：プリンタに適用 -speech：スピーチシンセサイザに適用 ： その他＞[[Google:html media属性]] ~ ***メディアタイプの記述例 -HTML link要素 <link rel="stylesheet" href="print.css" media="print"> -CSS @import @import url('print.css') print; -CSS @media @media print { nav{ display: none; } } ~ ~ **メディア特性 HTMLの link 要素・style 要素、CSS の @import、@media にお... -''max-width''：表示領域の最大幅（これ以下の場合に適用） -''min-width''：表示領域の最小幅（これ以上の場合に適用） -max-height：表示領域の最大高さ（これ以下の場合に適用） -min-height：表示領域の最小高さ（これ以上の場合に適用） -orientation：portrait（縦）/ landscape（横） -max-resolution：最大解像度（これ以下の場合に適用） -min-resolution：最小解像度（これ以上の場合に適用） ： その他＞ [[Google:CSS メディア特性]] ~ ***メディア特性の記述例 -HTML link要素 <link rel="stylesheet" href="mobile.css" media="screen ... -CSS @import @import url('mobile.css') screen and ( max-width:640px... -CSS @media @media screen and ( max-width:640px ) { nav{ display: none; } } ~ ~ 具体的な使用方法については [[ResponsiveDesign]] のページ... ~ ~

ページ名: