ホームページビルダーの 「レイアウト枠」と
「どこでも配置モード」 安倍 08/5/17改
「どこでも配置モード」とは |
「レイアウト枠」+「どこでも配置モード」による試作 |
|
拡大完成図 は → ここ |
・この試作ページは Homepage Builder Ver.11で作成。
・ページサイズは 940×1200ピクセル標準に設定。
・背景は、1024×768ピクセル画像をそのまま使用。 その上にタイトル画像や、リンクボタン、そしてテキストメニューを乗せて合成したものである。
・これらの画像は、ただ配置するだけなので簡単に挿入できる。
・枠色指定ができないので標準モードで指定しこれを「どこでもモード」にコピ−したがそれでも黒枠が残存した。(上の拡大完成図参照)
・スライス法では画像のスライス分解が必要で、再結合の際にズレが生じることがあるが、本法ではそのような問題はない。
使用に当たっての注意事項 → 必ず、レイアウト枠と組合せる |
ネットで指摘されている「どこでも配置モード」の問題 |
ネットで指摘されている問題はかなり解決しているようだ。
・画面幅が狭くなると文字列が重なってしまう。 その場合リンクが効かなくなる。
→(
レイアウト枠を指定することで解決)
「レイアウト枠」 と 「どこでも配置モード」のソースコード |
1)「どこでも配置モード」では、コードに下記のように、冒頭でページサイズを指定した後、「DIV」タグが挿入される。
<META name="IBM:HPB-Input-Mode" content="mode/flm; pagewidth=750; pageheight=900">
<DIV style="top : 110px;left : 50px;
position : absolute;
z-index : 1;
" id="Layer1">
<P>本日は晴天なり</P>
</DIV>
上の場合、
DIVタグで囲んだ中を、絶対座標指定で原点(左上0,0)を基準に
上から 110ピクセル、左から 50ピクセル の位置に下から一番目の重なりにLayer1という名で表示する。
という意味になる。
編集モードの状態ではグリッド表示、ページサイズ表示となる。
2)レイアウト枠(幅200ピクセル、高さ60px)の中に記入した場合は下記のようになる。
<DIV style="width : 200px;height : 60px ;top :110px;left : 50px;
position : absolute;
z-index : 1;
visibility : visible;
" id="Layer1">
本日は晴天なり
</DIV>
3)「レイアウト枠」の中に「どこでも配置モード」記入した場合は下記のようになる。
<META name="IBM:HPB-Input-Mode" content="mode/flm; pagewidth=750; pageheight=900">
<DIV style="width : 200px;height : 60px ;top :110px;left : 50px;
position : absolute;
z-index : 1;
visibility : visible;
" id="Layer1">
本日は晴天なり
</DIV>
編集モードの状態では、レイアウト枠編集に、グリッド表示とページサイズ表示が加わる。