Bootstrapの基本をおさえよう (5/5)
作成:2017-02-04 10:26
更新:2017-02-04 10:26
更新:2017-02-04 10:26
■<meta>タグについて
Bootstrap本体の機能ではないのですが、Bootstrap利用のWebページを用意するとき、必ず書いておく<meta>タグがあります。それらについても補足しておきましょう。
●IDEALLYの互換表示について
このタグは、Internet Explorer対策のためのものです。IEは、バージョンによって表示が変わります。場合によっては、勝手に「互換表示」というモードを使い、IE 7という古いバージョンにあわせて表示をしてしまうことがあります。これを禁ずるためのタグがこれです。このタグを書いておくと、IEでも互換表示にならず、標準表示のままになります。
●ビューポートのスケール設定について
これは、スマートフォン向けのWebサイトを書いたことがある人なら知っているでしょう。スマートフォンの画面の解像度に関係なく同じように表示させるために記述します。スマートフォンは、「ビューポート」という仮想スクリーンのようなものにWebページをレンダリングし、それをデバイスの画面にはめ込むようにして表示しています。それをうまいこと調整してくれるためのものです。
これらは、「IEを使わず、スマホも利用ない」なら不要なものですが、今の時代、どんな環境からアクセスしてくるかわかりませんから、必ず記述しておいたほうがよいでしょう。
●IDEALLYの互換表示について
<meta http-equiv="X-UA-Compatible" content="IE=edge">
このタグは、Internet Explorer対策のためのものです。IEは、バージョンによって表示が変わります。場合によっては、勝手に「互換表示」というモードを使い、IE 7という古いバージョンにあわせて表示をしてしまうことがあります。これを禁ずるためのタグがこれです。このタグを書いておくと、IEでも互換表示にならず、標準表示のままになります。
●ビューポートのスケール設定について
<meta name="viewport" content="width=device-width, initial-scale=1">
これは、スマートフォン向けのWebサイトを書いたことがある人なら知っているでしょう。スマートフォンの画面の解像度に関係なく同じように表示させるために記述します。スマートフォンは、「ビューポート」という仮想スクリーンのようなものにWebページをレンダリングし、それをデバイスの画面にはめ込むようにして表示しています。それをうまいこと調整してくれるためのものです。
これらは、「IEを使わず、スマホも利用ない」なら不要なものですが、今の時代、どんな環境からアクセスしてくるかわかりませんから、必ず記述しておいたほうがよいでしょう。
(by. SYODA-Tuyano.)
※プログラムリストが表示されない場合
AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。
※関連コンテンツ