
ページインスペクタの使い方
インスペクタ【ページ】は、選択しているページの名前(出力されるHTMLのファイル名にもなります)や、ヘッダ・フッタのサイズなど、ページ全体のレイアウトの調整を行 […]
- 2016/5/2
- 2008/2/10
インスペクタ【ページ】は、選択しているページの名前(出力されるHTMLのファイル名にもなります)や、ヘッダ・フッタのサイズなど、ページ全体のレイアウトの調整を行うインスペクタです。
自動的に作成される「ナビゲーションメニュー」の設定も、このインスペクタパネルで行います。
ページインスペクタは、ツールバーの「インスペクタ」ボタンか、「コマンドキー(アップルマークのあるキー)+オプションキー+iキー」で表示されます。
▼知りたいところから読む
ページパネル
ページインスペクタのページパネルの設定項目をご紹介します。
ページ名
選択されているページの名前を指定します。この名前はタイトルタグではなく、ファイル名になります。ページ名に日本語を使う場合、ブラウザによっては正しく表示されない事があります。
参考:ブログのエントリーページを英数字にする方法
タイトルタグは、サイドバーの一番上のサイト名になってしまいます。
ナビゲーションメニューにページを含める
ページのヘッダに表示するナビゲーションメニューに、選択されているページを含めるかどうか選択します。
ナビゲーションメニューを表示
ページのヘッダ(一番上)部分に、ページのリストを表示します。このリストはリンクになっていて、ナビゲーションメニューとして使えますが、ページ数が多いと見にくくなってしまうので、注意が必要です。
レイアウトパネル
ページインスペクタのレイアウトパネルの設定項目をご紹介します。
ページサイズ
- 上下のパディング
ページの最上部、最下部の隙間の設定です。 - コンテンツの幅
コンテンツを配置できるWebページキャンパスの幅の設定です。 - コンテンツの高さ
コンテンツを配置できるWebページキャンパスの高さの設定です。コンテンツの高さによってページの高さは変わりますので、最低限の高さの設定です。 - ヘッダの高さ
ページ上部にメニューなどをおくヘッダの高さです。 - フッタの高さ
ページ下部にメニューなどをおくフッタの高さです。
ページの背景
Webページキャンパスの背景の設定をします。「なし」「カラー塗りつぶし」「グラデーション塗りつぶし」「イメージ塗りつぶし」「半透明イメージ塗りつぶし」から選択できます。
「イメージ塗りつぶし」「半透明イメージ塗りつぶし」の時には、指定したイメージをどのように配置するか選択できます。イメージに合った配置の方法を選択しましょう。
ブラウザの背景
ブラウザで表示したときのWebページキャンパスの外側の背景を設定します。「カラー塗りつぶし」「イメージ塗りつぶし」から選択できます。