Dreamweaver MX 2004 をゼロから始める (3)

著者：Eve Cole 更新時間：2009-05-31 21:02:57

フレームワークを使用して Web ページを構築する<BR> いくつかのフォーラムにログインすると、左側に各ディスカッションエリアの名前が表示され、任意のディスカッションエリアをクリックすると、右側のエリアに対応するディスカッションエリアの内容が表示されます。左側と右側の部分は独立して表示されます。たとえば、左側のスクロールバーをドラッグしても右側の表示には影響しません。実際、これはページ内でフレームテクノロジを使用しているため、ブラウザの表示スペースをいくつかの部分に分割し、各部分で Web ページのコンテンツを独立して表示できます。また、複数のフレームを組み合わせてフレームセットを形成すると、ページにより豊かな効果を与えることができます。

1. フレームとフレームセットを作成する

ステップ 1: Dreamweaver MX 2004 で新しいページを作成します。「表示」→「ビジュアル補助」→「フレーム境界線」コマンドを実行すると、編集ウィンドウに境界線が表示されます。マウスで境界線をクリックすると、点線が表示されます。フレーム。新しく作成されたページがフレーム付きであることを示します。

ステップ 2: 「Alt」ボタンを押してマウスで境界線をドラッグし、マウスを放した後、ウィンドウを 2 つに分割し、ページを 2 つの境界線に分割します。たとえば、左右の境界線をドラッグするとウィンドウを左右に分割でき、上下の境界線をドラッグするとウィンドウを上下に分割できます。また、ウィンドウの四隅をドラッグすることで、ウィンドウを直接4つの領域に分割することもできます（図1）。ウィンドウが複数のフレームに分割されている場合、各フレームを独立した Web ページとして編集したり、既存のページをフレームに直接割り当てることができます。

図1

ステップ 3: フレームは入れ子にすることができます。たとえば、図 2 に示すフレームを作成するには、最初に上記の方法でフレームを水平に 2 つに分割できますが、その後、境界線を直接ドラッグすることはできません。そうしないと、フレームが取得されます。図 1 に示します。正しい方法は、まず右下隅のフレームパネルで右のフレームをクリックし、次に「Alt」ボタンを押して境界線をドラッグすることです。

図2
ヒント: 誤って枠線をドラッグしてしまった場合は、削除する必要がある線をマウスを使用して親フレームの枠線にドラッグして削除します。

2. 編集フレームワーク

ページではフレームとフレームセットが混在していることが多く、さまざまなオブジェクトを選択することでさまざまな属性設定を行うことができます。

ステップ 1: フレームセットのプロパティ。フレームセットを選択すると、プロパティオブジェクトパネルが表示されます (図 3 を参照)。「境界線」項目では境界線を表示するかどうかを設定でき、「境界線の幅」項目では境界線の幅を設定でき、「境界線の色」を設定できます。」で枠線の色を設定できます。また、このとき、パネル右側のサムネイルで行または列を選択し、その横の「値」入力ボックスに値を入力して選択することもできます。単位はピクセルまたはパーセンテージです。

図3
ステップ 2: フレームのプロパティ。フレームパネルで任意のフレームを選択すると、選択したフレームが黒い枠で表示されます。このとき、プロパティパネルで対応する設定を行うことができます (図 4)。たとえば、ここでは「Src」アドレスバーを使用してフレーム内にWebページファイルを設定できます。「スクロール」はスクロールバーを追加するかどうかを示し、「境界線」は境界線を表示するかどうかを決定し、「サイズ変更なし」は、ブラウザで変更するフレームサイズ、および「マージン幅」と「マージン高さ」はそれぞれ境界線の幅と高さを設定して、フレーム内のコンテンツと境界線の間の距離を決定します。

図4
ステップ 3: フレーム内にコンテンツを入力します。任意のフレームをマウスでクリックすると、通常の編集ページと同じように、さまざまなテキストコンテンツ、画像、Flash アニメーション、BGM、その他の Web ページ要素を挿入できます。

実際、フレームワークを使用すると、Web ページのレイアウトを合理的に計画できます。これは、Web デザインの初期段階で特に重要です。そのため、優れた Web サイトを構築するためには、誰もが日常的に練習する必要があります。