www.wanichan.com
ワニchanのうぇぶわーるど~Expression Web & FrontPage 総合情報&Tips~

任意の場所に画像を背景画像として固定させたいんだけど

はてなブックマーク | Yahoo!ブックマーク Yahoo!ブックマークでこのサイトを登録している人数 人が登録

はじめに

サイトを巡回していくと、以下のように右下に画像を配置させて固定させているところがあったりします。
FrontPageではどのように設定すればできるのでしょうか?

この技は一種のスタイルシートです。

FrontPageで操作するには

[書式]→[スタイル]をクリックします。

[スタイル]ダイアログボックスのスタイルの一覧から「body」を選択して、[変更]ボタンをクリックします。
スタイル

FrontPage 2000の場合

[スタイル変更]ダイアログボックスの[書式設定]ボタンをクリックし[罫線]をクリックします。
スタイルの変更

FrontPage 2002/2003の場合

[スタイル変更]ダイアログボックスの[書式設定]ボタンをクリックし、[枠線]をクリックします。

[枠線とパターン]ダイアログボックスの[パターン]タブをクリックします。
枠線とパターン

「パターン」オプション設定の[背景の画像]の[参照]ボタンをクリックして背景画像を指定して、
[繰り返し]→「繰り返しなし」
[張り込み形式]→[固定]
[縦位置]→一覧から選択するか直接入力でパーセンテージで指定
[横位置]→一覧から選択するか直接入力でパーセンテージで指定
最後にOKボタンをクリックして、すべてOKボタンで閉じます。

もしうまくいかない場合はHTMLビューに切り替えて
background-position: (横位置) を
background-position: (横位置) (縦位置) に指定して保存します。

▲Page TOP

FrontPage Expressで操作するには

直接HTML編集画面に切り替えて、手動で記述していかなければいけません。
スタイルシートの記述は基本的に<head>と</head>の領域内で挿入します。

例えば、私のサイト内のworm.gifを指定し、
その画像は繰り返しをせず(no-repeat)、かつスクロールしても画像を連動しないように固定(fixed)して、
右下に配置(right bottom)させる場合・・・

<style type="text/css">
<!--
body {
background-image: url('../../images/worm.gif');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right bottom
}
-->
</style>

bodyground-image: url(画像ファイルへのパス);
background-position: 横位置 縦位置

となります。

面倒でしたら、Microsoft Office 97以降をお持ちの方は
Expression Web 2 アップグレード版 をお買い求めください( ̄ー ̄)

▲Page TOP

HOME