ビデオ: What is Dreamweaver - Introduction to Dreamweaver - Dreamweaver Tutorial [3/54] 2025
Adobe Dreamweaver CS6のAP（Absolute-Positioned）部門の精度とピクセル位置合わせは、特にデザイナーにとって、プリントベースのレイアウトの柔軟性が好きな人。
ただし、場合によっては、ボックス内の他のコンテンツとインラインでフローするようにすることもできます。 AP Divは他の要素よりも上に浮かぶので、他のページコンテンツを移動しても位置には何の影響もありません。これは良いことでも悪いことでもあります。
<！ --1 - >より伝統的なインライン動作の場合、 相対配置 を使用するDIVを作成できます。これにより、要素を囲むコンテンツと共にシフトすることができ、より流動的なレイアウトにすることができます。このタイプの配置は、ネストされたコンテンツや、アイテムが他のページコンテンツと一致するような状況には重要です。
このタスクでは、[挿入]パネルの[共通およびレイアウト]カテゴリ内にある[Divタグの挿入]ツールを使用します。
<！ページ内をクリックしてカーソルを既存のAP divに配置し、[挿入]パネルの[共通とレイアウト]の下にある[Divタグの挿入]ツールをクリックしますカテゴリ。
-
Divタグの挿入ダイアログボックスが表示されたら、挿入ドロップダウンリストから場所を選択して、新しいDIVの場所を微調整します。
-
たとえば、[タグの開始後]を選択してページ内の既存のDIVタグ内に配置します。
<！ - 3 - >
Divタグの挿入ダイアログボックスのドロップダウンリストを使用して、DIVをページの前、後、または中に配置することもできます。 [挿入]ドロップダウンリストを[挿入ポイント]に設定したままにすると、描いた場所のままにするか、DIVを作成する別の場所を選択します。既存のクラスセレクタを適用する場合は、[クラス]ドロップダウンリストから選択します。それ以外の場合は空白のままにします。
-
既存のIDを使用できない場合は、IDフィールドに新しい名前を入力し、[新しいCSSルール]ボタンをクリックして新しいIDを作成します。
-
[新しいCSSルール]ダイアログボックスが表示されたら、新しいセレクタがIDに設定され、名前の前にシャープ記号（#）が付いていることを確認します。 [OK]をクリックします。
-
[CSSルール定義]ダイアログボックスが表示されたら、左のカテゴリリストから[位置]をクリックして選択し、CSSの配置プロパティを表示します。
-
「位置」領域で、「位置」メニューから「相対」を選択し、幅と高さのテキストボックスに幅と高さの値を入力し、「位置」プロパティの下に「上」と「左」の値を入力します。[OK]をクリックします。
-
[OK]をクリックして[Divタグの挿入]ダイアログボックスを閉じます。
-
相対的に配置された新しいDIVがプレースホルダテキストとともに現れる。
TopとLeftの値は、絶対配置されたDIVと相対的に配置されたDIVの動作がわずかに異なります。相対的な配置の場合、これらの値は、ページ内の設定された位置とは対照的に、周囲のコンテンツからのオフセットを示します。
