Adobe DreamweaverCS6 パーフェクトマスター

概 要

Adobe社のWebページ作成ツール「DreamweaverCS6」を最大限に使いこなすためのノウハウを詰め込んだ解説書です。いまどきのWebページは、構造を定義するHTMLと、デザインを施すCSS、それらを補完するプログラミング言語で成り立っていますが、Dreamweaverを使えば編集用画面に文字を書くだけ、あるいは画像をドラックアンドドロップするだけといった直感的な操作で、複雑なWebページを制作できます。本書では、Dreamweaverの基本的な操作方法と各機能を豊富な画面写真を使って完全解説しています。また、Webサイトの管理手法やspryなどのプログラム部品の活用、XMLを活用したデータベース、ASP.NETによるサーバサイド技術まで網羅しています。サンプルファイルのダウンロードサービス付き。

著者 金城俊哉&秀和システム第一出版編集部
価格 本体2800円(税別)
ISBN 978-4-7980-3421-8
発売日 2012/7/13
判型 B5変
色数 4色
ページ数 786
CD/DVD
対象読者 初級
シリーズ パーフェクトマスター
表紙イメージ
購入 アマゾンで購入する
楽天で購入する

※リンク先によっては、販売ページが用意されていないことがあります。あらかじめご了承ください。

新しいウィンドウで開く 書籍購入のご案内

サポート

サポート情報は以下からご参照下さい。

サポート情報へのリンク

目次

Chapter1 Dreamweaver CS6の概要と画面構成

1.1 Dreamweaver CS6の特徴

1.1.1 Dreamweaver CS6の機能

コラム Ajaxとは

コラム Spryとは

1.1.2 Dreamweaver CS6の主な新機能や強化された機能

1.1.3 Dreamweaver CS6に必要な環境(Windows版)

1.1.4 Dreamweaver CS6に必要な環境(Macintosh版)

1.2 Dreamweaver CS6の起動と終了(Windows版)

1.2.1 Dreamweaver CS6の起動

スタートメニューから起動するには

スタートページを表示しないようにするには

コラム スタートアップスクリーンとは

ショートカットから起動するには

コラム スタートページを再び表示するには

1.2.2 Dreamweaver CS6の終了

[ファイル]メニューから終了するには

[閉じる]ボタンを使って終了するには

1.3 Dreamweaver CS6の起動と終了(Macintosh版)

1.3.1 Dreamweaverを起動する

Finderを使ってDreamweaver CS6を起動するには

Dockに登録したアイコンから起動するには

1.3.2 Dreamweaver CS6の終了

1.4 Dreamweaver CS6の画面構成

1.4.1 Dreamweaverのワークスペース

Dreamweaver CS6のワークスペースを確認する

1.4.2 Macintosh版のワークスペース

Dreamweaver CS6 Macintosh版のワークスペースを確認する

1.4.3 ドキュメントウィンドウの構造

デザインビューの表示内容を確認する

コードビューの表示内容を確認する

分割ビューの表示内容を確認する

1.4.4 ビューの切り替え

コードビューを表示するには

分割ビューを表示するには

デザインビューを表示するには

1.5 Dreamweaver CS6のバーとパネル

1.5.1 メニューバー

[ファイル]メニューに登録されているコマンドを確認する

[編集]メニューに登録されているコマンドを確認する

[表示]メニューに登録されているコマンドを確認する

[挿入]メニューに登録されているコマンドを確認する

[修正]メニューに登録されているコマンドを確認する

[フォーマット]メニューに登録されているコマンドを確認する

[コマンド]メニューに登録されているコマンドを確認する

[サイト]メニューに登録されているコマンドを確認する

[ウィンドウ]メニューに登録されているコマンドを確認する

[ヘルプ]メニューに登録されているコマンドを確認する

1.5.2 ドキュメントツールバー

ドキュメントツールバーを表示するには

ドキュメントツールバーの機能を確認する

1.5.3 標準ツールバー

標準ツールバーを表示するには

標準ツールバーの機能を確認する

1.5.4 ステータスバー

ステータスバーの機能を確認する

1.5.5 挿入バー

挿入バーを表示するには

挿入バーのカテゴリを切り替えるには

コラム ドキュメントツールバーを非表示にする

コラム Macintosh版における[Dreamweaver]メニュー

コラム Adobe Bridgeとは

コラム 挿入バーのカテゴリをメニューとして表示するには

挿入バーの機能を確認する

1.5.6 パネルグループ

アイコン化されたパネルを展開するには

表示されていないパネルを表示するには

パネルの機能を確認する

1.5.7 プロパティインスペクター

プロパティインスペクターを表示するには

プロパティインスペクターの内容を確認する

コラム プロパティインスペクターの非表示

1.6 ワークスペースのカスタマイズ

1.6.1 ワークスペースのレイアウトを変更する

パネルグループの表示幅を変更するには

パネルグループを画面の左側に配置するには

ドキュメントウィンドウ以外を非表示にするには

複数のドキュメントウィンドウを並べて表示するには

コラム ドキュメントウィンドウを元の状態に戻すには

プロパティインスペクターをフローティング表示するには

1.6.2 タブグループのカスタマイズ

特定のタブグループをフローティング表示にするには

フローティング表示にしたタブグループを元に戻すには

コラム プロパティインスペクターを元の位置へ戻すには

特定のタブだけをフローティング表示にするには

フローティング表示にしたタブを元に戻すには

特定のパネルを別のタブグループへ移動するには

特定のタブグループを閉じるには

コラム タブグループの再表示

独自のタブグループを作成するには

コラム ワークスペースを元の状態に戻すには

コラム 新規に作成したパネルグループだけを表示するには

1.6.3 挿入パネルの[お気に入り]をカスタマイズする

挿入パネルの[お気に入り]カテゴリに任意のボタンを登録するには

コラム [お気に入りオブジェクトのカスタマイズ]ダイアログボックスの操作方法

Q&A

Chapter2 サイトの作成

2.1 サイトの概要

2.1.1 サイトの概要

サイトについて確認する

ローカルサイトとリモートサイト

2.1.2 Dreamweaver CS6のサイト管理機能

Dreamweaver CS6のサイト管理機能を確認するには

コラム LAN上のパソコンにローカルサイト用フォルダーを作成する場合

コラム トップページの保存場所

2.2 サイトの作成

2.2.1 サイト作成の準備

サイトの構造を決定する流れを確認する

2.2.2 サイトを公開する目的の確認

情報のグループ化

2.2.3 ローカルサイト用フォルダーの準備

ローカルサイト用フォルダーを作成する場所を決める

フォルダーの構造を決める

ローカルサイト用フォルダーを作成するには(Windows編)

ローカルサイト用フォルダーを作成するには(Macintosh編)

コラム サーバーサイドテクノロジー

2.2.4 サイトの作成

[サイト定義]ウィザードを起動するには

ローカルサイトを登録するには

リモートサイトを登録するには

コラム 使用する接続欄の選択項目

コラム LAN上のパソコンにあるフォルダーをローカルサイトにするには

コラム WebサーバーにLANで接続されている場合

コラム サイト設定を再編集するには

チェックアウト機能を設定するには

コラム FTP

コラム FTPの設定

2.2.5 ローカルおよびリモートサイトの表示

ローカルサイトを表示するには

リモートサイトを表示するには

コラム リモートサイトへの接続を切断するには

ローカルサイトとリモートサイトを同時に表示するには

Q&A

Chapter3 新規ページの作成

3.1 新規ページの作成

3.1.1 新規ページの作成

[ファイル]メニューを使って新規のページを作成するには

[スタートページ]を使って新規のページを作成するには

[ファイル]パネルを使って新規のページを作成するには

コラム ローカルサイト内の任意のフォルダーに新規ファイルを作成するには

コラム 初期設定のドキュメントタイプ

XHTMLファイルの機能を確認する

コラム ファイル作成時にドキュメントタイプを指定するには

コラム ドキュメントタイプの記述部分を見る

コラム ドキュメントタイプを変更するには

3.2 ページの保存

3.2.1 新規ページの保存

3.2.2 保存したページを開くための操作

保存済みのページを[ファイル]メニューから開くには

コラム 複数のページを開く

保存済みのページを[スタートページ]から開くには

保存済みのページを[ファイル]パネルから開くには

3.2.3 編集内容の保存

編集した内容を上書き保存するには

コラム ページをまだ保存していない場合

編集した内容を別のページとして保存するには

複数のページをまとめて保存するには

コラム [スタートページ]の[最近使用した項目を開く]

3.3 ページの基本設定

3.3.1 ページのサイズ設定

Webブラウザーの表示サイズを知る

ページの表示サイズを設定するには

コラム 縦スクロールと横スクロールはどちらが使いやすいか

コラム ウィンドウの縮小表示

コラム 表示サイズの選択

3.3.2 ページタイトルの設定

[ページプロパティ]を使ってページタイトルを設定するには

[ドキュメント]ツールバーを使ってページタイトルを設定するには

コラム [ページプロパティ]においてCSSが使用される項目

3.3.3 マージンの設定

ページのマージンを設定するには

3.3.4 ページ全体の文字コードの設定

ページ全体の文字コードを設定するには

文字コードの初期設定値を変更するには

3.4 テキスト入力の基本操作

3.4.1 テキストの入力

ページにテキストを入力するには

コラム 入力したテキストを消すには

他のファイルからテキストをコピーするには

3.4.2 テキストのコピー&ペースト

コピーしたテキストをペーストするには

コラム コピー&ペーストをすばやく行うには

テキストを別の位置へ移動するには

コラム CSSを使用したマージンの設定

3.4.3 テキストの置き換え

特定のテキストをまとめて別のテキストに置き換えるには

コラム サイト内の特定のテキストを一括して置き換えるには

コラム カット&ペーストをすばやく行うには

3.5 段落の設定

3.5.1 段落と改段落

改段落して行間を空けるには

コラム 改段落のHTMLタグを確認する

行間を空けずに改行のみを行うには

コラム 改行のHTMLタグを確認する

段落を区切り線を使って分割するには

コラム 区切り線

3.5.2 リストの設定

テキストを箇条書きで表示するには

コラム 区切り線の編集

段落記号の●を■に変更するには

段落ごとに番号を付けるには

コラム 段落ごとに本文を入れる

コラム リストのHTMLタグを確認する

コラム 段落番号を途中から始めるには

段落番号の種類を変更するには

3.6 ライブビューを使用したWebページのプレビュー

3.6.1 ライブビューによるWebページのプレビュー

作成中のWebページをライブビューでプレビューする

3.6.2 ライブビューナビによる実際のWebページのプレビュー

ライブビューナビで実際のWebページを開く

ライブビューナビでリンク先のページを開く

コラム 左ボタンのクリックで次のページが開くようにするには

コラム 公開中のWebページの関連ファイルを確認する

3.6.3 ライブコード機能によるソースコードの確認

3.7 プレビュー用のWebブラウザーの設定

3.7.1 Webブラウザーを使ったプレビュー

作成したページをWebブラウザーでプレビューするには

コラム 保存済みのページを対象にしたプレビュー

編集内容をすぐに確認できるようにするには

3.7.2 ブラウザーリストの編集

プレビュー用のWebブラウザーを登録するには

コラム プライマリブラウザーとセカンダリブラウザー

新たに登録したWebブラウザーでプレビューするには

3.8 操作の取り消しとやり直し

3.8.1 操作の取り消しとやり直し

直前に行った操作を取り消すには

取り消した操作をもう一度やり直すには

複数の操作をまとめて取り消すには

コラム [ファイル]メニューの[復帰]

ページを開いたときの状態まで戻すには

Q&A

Chapter4 CSSを利用したスタイル設定

4.1 テキストのスタイル設定

4.1.1 CSSルールの基本

CSSの役割について確認する

CSSルール用のプロパティインスペクターを確認する

CSSルールの仕組みを知る

コラム CSSに関する用語について

コラム HTML用の[プロパティインスペクター]

コラム HTMLファイルのヘッダー部

コラム CSSスタイルを記述する場所

CSSルールの適用範囲

CSSルールの定義方法を確認する

コラム CSSルールの定義

4.1.2 CSSルールの作成と適用

プロパティインスペクターからクラススタイルを作成するには

コラム Web標準への準拠

コラム クラススタイルの作成

クラススタイルを他の段落に適用するには

CSSルールを特定の範囲のテキストに適用するには

適用したCSSルールを解除するには

CSSルールの名前を独自の名前に変更するには

不要になったクラススタイルを削除するには

コラム [CSSスタイル]パネルを使ってCSSルールを適用する

4.2 CSSルールとボックスの構造

4.2.1 CSSにおけるボックス構造

ボックスの構造を確認する

ボックスの役割を確認する

コラム ブロック要素とインライン要素

コラム APエレメントが回り込みを設定できない理由

4.2.2 インスペクトモードの利用

インスペクトモードに切り替えてボックス構造を色分けする

任意のCSSルールを確認・編集する

親要素と子要素の表示をキーボードで切り替える

4.3 テキストの外観の設定

4.3.1 テキストのサイズとカラー設定

テキストのサイズを指定するには

コラム テキストの表示サイズと単位

テキストのカラーを指定するには

テキストのカラーを設定する際の注意点を確認する

コラム RGB値の指定

段落内のテキストのスタイルをまとめて設定するには

テキストに複数のCSSルールを設定するには

4.3.2 フォントの指定

フォントとは

テキストのフォントを指定するには

コラム HTMLによる文字サイズの設定

コラム フォントリスト

コラム フォントの指定を確認する

独自のフォントリストを作成するには

コラム システムにインストールされていないフォントを指定する場合

必要のないフォントリストを削除するには

4.3.3 ページ全体のテキストのスタイル設定

ページ全体のテキストのスタイルを設定するには

コラム ページプロパティの適用範囲

コラム ページプロパティのコードを確認する

4.4 Webブラウザーにおけるテキストの表示

4.4.1 Webブラウザーにおけるテキストの表示

Webブラウザーの種類による表示の違いを確認する

CSSルールが使用される範囲を確認する

4.4.2 解像度の違いによる文字サイズの変化

解像度とピクセル数に関する基礎知識

ポイント(pt)でサイズ指定した文字の表示方法を検証する

コラム dpi

コラム ドットとピクセル

ポイント指定による文字サイズの差異を実際に検証する

コラム 文字の大きさを統一したいときはフォントを指定する

4.5 [新規CSSルール]ダイアログボックスを使用したCSSルールの作成と編集

4.5.1 独自のCSSルールの作成(クラススタイルの作成)

独自のクラススタイルを作成するには

コラム 作成されたクラススタイルを確認する

コラム 独自のクラススタイルの作成

コラム 外部スタイルシートへのリンク

コラム クラススタイルを内部スタイルシートに記述する方法

コラム IDスタイルのCSSルールを作成するには

クラススタイルで定義したCSSルールを適用するには

コラム 「class」と「id」の違い

コラム CSSルールのテキストへの適用を確認する

4.5.2 CSSルールによるHTMLタグの再定義(HTMLタグスタイルの作成)

HTMLタグを再定義してCSSルールを作成するには

コラム HTMLタグの再定義

コラム 作成済みの外部スタイルシートにCSSルールを追加する方法

4.5.3 CSSルールによるHTMLタググループの再定義(複合スタイルの作成)

複数のHTMLタグを再定義してCSSスタイルを作成するには

コラム HTMLタグの再定義をコードビューで確認する

CSSセレクタースタイルで定義したスタイルを適用するには

コラム 複合スタイルの効果

4.5.4 CSSスタイル定義の編集

定義済みのCSSルールを編集するには

コラム 適用したCSSルールの解除

4.5.5 CSSスタイルパネルの機能

CSSスタイルパネルの機能を確認する

4.6 外部スタイルシートの活用

4.6.1 外部スタイルシートの作成

外部スタイルシートを新規に作成するには

コラム [CSSスタイル]パネルを使用した外部スタイルシートの作成方法

内部スタイルシートを外部スタイルシートに書き出すには

コラム 不用になった内部スタイルシートを削除する方法

4.6.2 外部スタイルシートの適用

外部スタイルシートへのリンクを設定するには

コラム 外部スタイルシートの適用

外部スタイルシートにCSSルールを追加するには

コラム 新規のクラススタイルの作成

コラム 外部スタイルシートの編集

4.7 テキストの強調と背景の設定

4.7.1 強調と文字飾り

テキストを太字で表示するには

コラム 太字の設定

コラム HTMLタグを使って太字にする方法

コラム [ボールド]ボタンを使ってスタイル設定を行う

コラム HTMLタグを使って斜体にする方法

文字を斜体で表示するには

コラム 斜体の設定

英文を小さく表示するには

コラム スモールキャップスの設定

文字にラインを付けるには

4.7.2 テキストの背景色の設定

背景色を設定するクラススタイルを作成するには

コラム 段落全体に設定したスタイルを解除するには

段落全体の背景色を設定するには

特定のテキストだけに背景色を設定するには

コラム テキストに設定したCSSルールを解除するには

コラム テキストの背景イメージを表示するには

コラム 文字飾り

4.7.3 テキストの表示位置の設定

CSSスタイルを使って2行目以降を字下げするには

コラム 設定されたCSSルールを確認する

4.8 背景の設定

4.8.1 効果的な背景色を設定するためのポイント

カラープランを立てる

コラム 画像の補正について

Webセーフカラーについて

4.8.2 背景色の設定

カラーピッカーを使って背景色を設定するには

コラム 背景色を設定する際の注意点

コラム 画面上に表示されている他のアプリケーションから色を吸着する

4.8.3 背景イメージの設定

ページの背景にイメージを設定するには

コラム イメージファイルの参照

背景が連続して表示されないようにするには

コラム 絶対パスと相対パス

Q&A

Chapter5 文書の構造化とCSSの活用

5.1 文書の構造化とCSSルールの適用

5.1.1 見出しと本文のスタイル設定

見出しと本文のスタイルを決める

見出し1のCSSルールを定義するには

見出し2のCSSルールを定義するには

見出し3のCSSルールを定義するには

本文用のCSSルールを定義するには

コメント用のCSSルールを定義するには

ボーダー用のCSSルールを定義するには

コラム ボーダーの高さ

ページ全体のマージンを設定するには

5.1.2 CSSルールの適用

見出し1のCSSルールを適用するには

見出し2のCSSルールを適用するには

本文用のCSSルールを適用するには

見出し3のCSSルールを適用するには

コラム 大見出しにイメージを使用する

コラム 余白を活用した文書のレイアウト

コメント用のCSSルールを適用するには

ボーダー用のCSSルールを適用するには

5.2 段落内のスタイル設定

5.2.1 行に対するスタイル設定

行間隔を指定するには

1行目のテキストの開始位置を指定するには

5.2.2 テキストの配置に対するスタイル指定

テキストの間隔を指定するには(文字間隔)

5.3 テキストブロックの表示

5.3.1 テキストブロックの表示

テキストブロックを表示するには

コラム ボックスのサイズについて

コラム ボックスを画面中央に表示する方法

コラム テキストブロックのフローティング表示

コラム ボックスにスクロールバーを表示する

Q&A

Chapter6 イメージの挿入と編集

6.1 イメージの基礎知識

6.1.1 イメージファイルの形式

Webで利用できるイメージのファイル形式を確認する

6.1.2 イメージの準備

イメージを用意する方法を確認する

6.1.3 グラフィックソフトの利用

特定のグラフィックソフトを関連付けるには

関連付けたグラフィックソフトでイメージを編集するには

6.2 イメージを表示するための基本操作

6.2.1 イメージの挿入

イメージを挿入するには

コラム イメージファイルへのパスの指定

コラム 絶対パスと相対パス

コラム イメージを挿入するHTMLタグを確認する

コラム イメージを取り込むテクニック

コラム イメージを挿入した場合の表示時間を確認する

6.2.2 イメージの交換と削除

イメージを別のイメージに取り替えるには

挿入したイメージを削除するには

コラム イメージプレースホルダーを使う

コラム サイズ変更ハンドル

コラム 変更したサイズを元に戻すには

コラム Dreamweaver CS6でイメージを編集する

6.3 CSSルールによる表示位置の指定

6.3.1 インラインでのイメージの埋め込み

本文のブロックにインラインでイメージを埋め込むには

コラム 行間の設定

コラム レイアウト崩れを防止する

イメージのまわりの余白を設定するには

コラム イメージを段落の右側に表示する

コラム マージンの設定

コラム CSSルールを活用したページの作成

Q&A

Chapter7 CSSを使用したレイアウト

7.1 CSSスターターレイアウトの利用

7.1.1 CSSスターターレイアウト機能を使った新規ページの作成と編集

CSSスターターレイアウト機能で新規ページを作成するには

コラム レイアウト用のCSSをどこに保存するかを決める

CSSスターターレイアウト機能で作成したページを編集するには

7.1.2 CSSスターターレイアウトの種類

1段組のレイアウト

2段組のレイアウト

3段組のレイアウト

コラム 中央揃えのレイアウトを左揃えにするには

7.2 固定型1段組ページの作成

7.2.1 スタイルの定義

ページ全体のスタイルを定義するには

ヘッダーのスタイルを定義するには

本体部分のスタイルを定義するには

コラム タグ要素と独自のクラス名を組み合わせたエレメント名

メインコンテンツ用のスタイルを定義するには

見出し1のスタイルを定義するには

見出し2のスタイルを定義するには

見出し3のスタイルを定義するには

コメント用のスタイルを定義するには

本文用テキストのスタイルを定義するには

本文の左側に配置するイメージのスタイルを定義するには

本文の右側に配置するイメージのスタイルを定義するには

7.2.2 テキストの入力

テキストを入力するには

7.2.3 本体部分のスタイル設定

本体部分のスタイルを適用するには

コラム ブロック要素にCSSルールを適用する場合は<div>タグを使う

7.2.4 ヘッダーのスタイル設定

ヘッダーにスタイルを適用するには

7.2.5 見出しのスタイル設定

見出し1をマークアップするには

見出し2をマークアップするには

見出し3をマークアップするには

7.2.6 本文のスタイル設定

本文にスタイルを適用するには

イメージを挿入してスタイルを適用するには

メインコンテンツ用のスタイルを適用するには

コラム ブロック要素に対するCSSルールの適用

7.2.7 ナビゲーションバーの作成

ナビゲーションバーのスタイルを定義するには

コラム クラススタイル「p.menu」の内容

バー内部のメニューボタンのスタイルを定義するには

コラム 「p.menu a」が適用される仕組み

コラム クラススタイル「p.menu a」の内容

コラム [Line-height]でブロックの高さを指定する理由

メニューボタン用のテキストを入力するには

メニューボタン用のテキストにリンクを設定するには

ナビゲーションバーにスタイルを適用するには

コラム ナビゲーションバーが表示される仕組み

コラム スタイルの適用

ロールオーバーを設定するには

7.2.8 表示状態の確認

完成したページをプレビューするには

コラム ブラウザーの表示サイズが小さい場合

7.3 フローティング型1段組ページの作成

7.3.1 フローティングの設定

ページをフローティングさせる手順を確認する

ページをフローティングさせるCSSルールを定義するには

7.3.2 フッターの設定

ページにフッターを付けるには

コラム テキストのみのページを作る

7.4 固定型2段組ページの作成

7.4.1 CSSルールの作成

全体のCSSルールを作成するには

ヘッダーのCSSルールを作成するには

フッターのCSSルールを作成するには

コラム 絶対配置

メインコンテンツのCSSルールを作成するには

サイドバーのCSSルールを作成するには

コラム インライン要素からブロック要素への変換

その他のCSSルールを定義する

7.4.2 テキストの入力とCSSルールの適用

テキストを入力するには

ヘッダーのCSSルールを適用するには

サイドバーとリンクボタンにCSSルールを適用するには

コラム 最後のテキストにリンクが設定できない場合

メインコンテンツにCSSルールを適用するには

メインコンテンツ内部のCSSルールを適用するには

フッターにCSSルールを適用するには

ページ全体の背景を設定するには

7.5 フローティング型2段組ページの作成

7.5.1 ページをフローティング表示するためのCSSルールの作成

ページの作成手順を確認する

本体のスタイルに回り込みを設定するには

サイドバーの回り込みを設定するには

メインコンテンツとサイドバーの位置を確認するには

7.5.2 フローティング用のCSSルールの作成と適用

ページをフローティングさせるスタイルを作成するには

ページ全体をフローティングさせるCSSルールを適用するには

7.6 固定型3段組ページの作成

7.6.1 CSSルールの作成

ページ全体のサイズを設定するCSSルールを作成するには

ヘッダーのCSSルールを作成するには

フッターのCSSルールを作成するには

メインコンテンツのCSSルールを作成するには

その他のCSSルールを定義する

7.6.2 テキストの入力とCSSルールの適用

テキストを入力するには

ヘッダーのCSSルールを適用するには

左側のサイドバーとリンクボタンにCSSルールを適用するには

ページ全体のサイズを設定するCSSルールを適用するには

メインコンテンツにCSSルールを適用するには

右側のサイドバーとリンクボタンにCSSルールを適用するには

フッターにCSSルールを適用するには

ページ全体の背景を設定するには

7.7 フローティング型3段組ページの作成

7.7.1 ページをフローティング表示するためのCSSルールの作成

ページを作成する手順を確認する

7.7.2 フローティング用のルールの追加と適用

ページをフローティングさせるスタイルを作成するには

Q&A

Chapter8 APエレメントによるレイアウト

8.1 APエレメントの機能と仕組み

8.1.1 APエレメントの役割

APエレメントの仕組みを確認する

APエレメントの用途を確認する

8.2 APエレメントの作成と編集

8.2.1 APエレメントの作成

マウスを使ってAPエレメントを描画するには

[挿入]メニューを使ってAPエレメントを挿入するには

コラム 挿入されるAPエレメントのサイズをあらかじめ指定する

APエレメントを選択するには

APエレメントの識別名を設定するには

APエレメントを削除するには

8.2.2 APエレメントのサイズ変更

サイズ変更ハンドルを使ってAPエレメントのサイズを変更するには

矢印キーを使ってAPエレメントのサイズを1ピクセル単位で変更するには

コラム サイズ変更ハンドル

コラム 矢印キーによるAPエレメントの拡大と縮小

[プロパティインスペクター]を使ってAPエレメントのサイズを指定するには

コラム [プロパティインスペクター]の[幅]と[高さ]に関する注意点

8.2.3 APエレメントの移動

選択ハンドルを使ってAPエレメントを移動するには

矢印キーを使って1ピクセル単位でAPエレメントを移動するには

数値を使ってAPエレメントを移動するには

コラム [プロパティインスペクター]の[左]と[上]

8.2.4 [APエレメント]パネルによる操作

[APエレメント]パネルを表示する

[APエレメント]パネルを使ってAPエレメントを選択するには

8.3 APエレメントによるコンテンツの表示

8.3.1 APエレメントによるイメージの表示

APエレメント内にイメージを挿入するには

コラム イメージの挿入

8.3.2 APエレメントによるテキストの表示

APエレメント内にテキストを入力するには

APエレメントの背景色を独自に設定するには

APエレメント内に配置したテキストのスタイルを設定するには

コラム APエレメント自体にクラススタイルを適用するには

コラム APエレメントのサイズ表示

8.3.3 APエレメントの重ね合わせ

APエレメント内にテキストを入力するには

APエレメント同士を重ね合わせて一体化するには

コラム APエレメントのネスト

コラム ネストさせずに複数のAPエレメントを一緒に移動するには

コラム Zインデックスを指定して重ね順を指定する

コラム APエレメントを一時的に非表示にする

8.3.4 APエレメントの整列とサイズの統一

ばらばらに配置されたAPエレメントを整列させるには

複数のAPエレメントのサイズを統一するには

APエレメントをグリッドに揃えて配置するには

コラム APエレメントの整列

コラム APエレメントのサイズの統一

コラム [プロパティインスペクター]を使ったサイズの統一

コラム グリッドの設定

8.4 APエレメントのテーブルへの変換

8.4.1 APエレメントのレイアウトテーブルへの変換

APエレメントをレイアウトテーブルに変換するには

コラム [絶対位置のDIVをテーブルに変換]ダイアログボックスのオプション

Q&A

Chapter9 データテーブルの作成

9.1 データテーブルの作成

9.1.1 データテーブルの作成

テーブルの仕組みを確認する

テーブルを挿入するには

テーブルを削除するには

コラム テーブルにタイトルを付けるには

9.1.2 テーブルのサイズ設定

マウスを使ってテーブルのサイズを変更するには

コラム テーブルの選択

ピクセル単位でテーブルの幅を指定するには

コラム テーブルのサイズ変更ハンドル

コラム テーブルの移動

画面サイズに対する比率でテーブルの幅を指定するには

9.1.3 テーブルを表示する位置の指定

テーブルを別の段落へ移動するには

テーブルを中央に揃えて表示するには

9.2 テキストおよびイメージの挿入

9.2.1 テキストの入力

テーブル内部のセルにテキストを入力するには

セルに見出しを設定するには

9.2.2 イメージの挿入

セルにイメージを挿入するには

コラム 拡張テーブルモードとは

コラム [ヘッダー]の設定

9.3 行および列の操作

9.3.1 テーブルにおける行の操作

テーブル内に行を追加するには

複数の行をまとめて追加するには

特定の行の高さを変更するには

特定の行を削除するには

行単位でデータを移動するには

9.3.2 列の操作

テーブル内に列を追加するには

複数の列をまとめて追加するには

特定の列の幅を変更する

特定の列を削除する

列単位でデータを移動するには

コラム 追加位置の指定

列内のすべてのテキストを中央揃えで表示するには

9.4 セルの編集

9.4.1 セルの分割と結合

複数のセルを結合して1つのセルにするには

1つのセルを複数のセルに分割するには

9.4.2 セルのレイアウト調整

テーブル内のセルの列幅と高さを一括して変更するには

セルの余白を調整するには

セル同士の間隔を調整するには

セル内のデータを中央に配置するには

セル内のイメージにテキストを回り込ませるには

コラム CSSルールでセルの余白とマージンを指定する

コラム テキストを回り込ませる位置

コラム CSSルールを適用してテキストを回り込ませる

セル内のテキストにCSSスタイルを適用するには

セルに背景色を設定するには

コラム CSSでセルの背景色を指定する

9.5 テーブルの編集

9.5.1 テーブルのデザイン設定

テーブルに背景色を設定するには

テーブルのボーダーをカラーで表示するには

9.6 テーブル内のデータの操作

9.6.1 外部データの読み込み

外部のデータファイルを読み込むには

コラム ソートの条件

9.6.2 データの並べ替え

指定した条件でテーブル内のデータを並べ替えるには

コラム [表データの読み込み]ダイアログボックス

Chapter10 リンクとナビゲーション

10.1 リンクの設定

10.1.1 テキストに対するリンクの設定

テキストにリンクを設定するには

[ファイル]パネルを使ってリンクを設定するには

コラム リンクの設定

コラム リンク先のページをDreamweaver CS6で開くには

コラム [ファイル]パネルで設定したリンク先を変更する

リンクを解除するには

10.1.2 リンク用テキストの編集

リンク用テキストの表示色を設定するには

コラム [リンクカラー]、[ロールオーバーリンク]、[訪問済みリンク]、[アクティブリンク]

10.1.3 イメージ対するリンクの設定

イメージにリンクを設定するには

コラム 設定したリンク先を変更する

コラム CSSルールを確認する

コラム [ファイル]パネルの利用

10.1.4 リンク先の表示

リンク先を新しいウィンドウに表示するには

10.1.5 サイト以外のリンク設定

Web上のページにリンクを設定するには

メール送信用のリンクを設定するには

ファイルのダウンロード用のリンクを設定するには

10.2 アンカーポイントの設定

10.2.1 アンカーポイントの配置とリンクの設定

アンカーポイントを配置するには

同じページの特定の場所にリンクを設定するには

コラム アンカーポイントの削除

コラム アンカーポイントの名前を変更する

他のページの特定の場所にリンクを設定するには

10.3 ビヘイビアーを利用したナビゲーションメニューの作成

10.3.1 ジャンプメニューの作成

ジャンプメニューを作成するには

コラム ジャンプメニューに移動用のボタンを付けるには

ジャンプメニューの項目を追加するには

コラム ジャンプメニューの修正

コラム リンク先の設定

10.4 ロールオーバーとスワップイメージの作成

10.4.1 ロールオーバーイメージの作成

ロールオーバーイメージを配置するには

コラム リンク先の設定

配置済みのイメージにロールオーバーイメージの設定を行うには

ロールオーバーイメージにリンクを設定するには

コラム スワップイメージの設定

10.4.2 スワップイメージの配置

スワップイメージを配置するには

コラム スワップイメージのサイズ

リンクボタンで複数のイメージを切り替えるようにするには

コラム スワップイメージによる複数イメージの切り替え

10.5 サブウィンドウの作成

10.5.1 サブウィンドウの設定

新しいウィンドウにリンク先を表示させるには

サブウィンドウをボタンクリックで開くようにするには

コラム 指定できるウィンドウの機能

コラム [ブラウザーウィンドウを開く]アクションにおけるJavaScriptのコード

コラム [ブラウザーウィンドウを開く]アクション

コラム サブウィンドウをボタンクリックで開く仕組み

10.5.2 サブウィンドウの機能の設定

サブウィンドウの機能を指定するには

Q&A

Chapter11 ビヘイビアー&JavaScriptによる動的処理の設定

11.1 ビヘイビアーによる動的処理の設定

11.1.1 代替イメージの表示

重たい画像を読み込む間に別の画像を表示させるには

コラム 訪問者のブラウザーがJavaScriptをオフにしている場合

コラム 代替イメージの表示

11.2 JavaScriptの記述

11.2.1 JavaScriptによる動的処理の実行

時刻によってイメージを切り替えて表示させるには

コラム リファレンスパネル

コラム JavaScriptのコードを記述する際の注意

コラム 切り替えるimageの設定

Q&A

Chapter12 Webの作成と管理に役立つ機能

12.1 サイトの管理

12.1.1 ファイル名の変更と保存場所の移動

リンク切れを起こさずにファイル名を変更できるようにするには

コラム [ファイルを移動するときにリンクを更新する]

ローカルサイト内のファイル名を変更するには

コラム [ファイルの更新]ダイアログボックス

新規フォルダーを作成してファイルを移動するには

コラム 特定のファイルのリンク切れをチェックするには

12.1.2 リンク状況のチェック

ローカルサイト内のリンク切れをチェックするには

リンク切れを修正するには

不要なファイルを検出して削除するには

コラム 不要なファイルの削除

特定のファイルへのリンクを一括して変更するには

12.1.3 ローカルサイトのバックアップ

ローカルサイト全体をバックアップするには

12.2 Webページの問題点のチェック

12.2.1 サイト内の問題点のチェック

サイト内の問題点をピックアップするには

12.2.2 HTMLコードの問題点のチェック

HTMLコードの問題点をピックアップするには

不要なHTMLコードを削除するには

12.2.3 Webブラウザーの対応状況のチェック

コラム エラーの修正

コラム レポートの内容

コラム レポート結果の一部が隠れている場合

コラム ターゲットとなるブラウザーの指定

12.2.4 BrowserLabでクロスブラウザーテストを行う

編集中のWebページをBrowserLabで表示するには

表示を確認したいWebブラウザーの種類を変更するには

表示方法を変更するには

ガイド線を利用するには

表示倍率を変更するには

BrowserLabのその他の機能を確認する

12.3 リモートサイトへのアップロード

12.3.1 リモートサイトへのアップロード

ローカルサイトのデータをリモートサイトにアップロードするには

ローカルサイトとリモートサイトの内容を同期させるには

コラム ローカルサイトとリモートサイトを完全に同じ状態にする

12.3.2 リモートサイトからのダウンロード

リモートサイトのファイルをダウンロードするには

12.4 テンプレート

12.4.1 テンプレートの作成

テンプレートを作成するには

編集可能領域を設定する

テンプレートを保存する

テンプレートから新規のページを作成する

テンプレートの内容を変更する

コラム 既存のページをテンプレートにする

Q&A

Chapter13 ASP.NET対応ページの作成

13.1 ASP.NETを利用するための準備

13.1.1 Dreamweaver CS6におけるASP.NETの利用

Webアプリケーションを開発するための環境を確認する

コラム 自前のWebサーバーの必要性

13.1.2 IISのインストール

WindowsにIISをインストールするには

コラム IISのホームディレクトリ

13.1.3 ASP.NETを利用するためのサイトの作成

ASP.NETを利用するためのサイトの構造を確認する

ASP.NETを利用するための専用のサイトを構築するには

コラム フォルダーのアクセス許可を取得する

コラム サイトのURL

コラム IISのホームディレクトリを変更する

13.2 ASP.NETページの作成

13.2.1 ASP.NETページの新規作成

空白のASP.NETページを新規に作成するには

作成したASP.NETページを保存するには

ASP.NETページをブラウザーでプレビューするには

13.3 ASP.NETユーザーコントロールを利用したコードの再利用

13.3.1 ASP.NETコントロール

ASP.NETユーザーコントロールについて確認する

Dreamweaverが生成するPage ディレクティブを確認する

13.3.2 ASP.NETユーザーコントロールの作成

ヘッダー用ユーザーコントロールを作成するには

フッター用ユーザーコントロールを作成するには

ヘッダーおよびフッターユーザーコントロールを呼び出す

ASP.NETページを作成するには

ブラウザーで確認するには

Q&A

Chapter14 Spry(Ajaxフレームワーク)の使用

14.1 AjaxフレームワークとSpry

14.1.1 Ajaxの概要

Ajaxについて確認する

14.1.2 Spryの機能

Spryについて確認する

14.2 メニューバーWidgetの配置

14.2.1 メニューバーWidgetの配置

メニューバーWidgetを配置するには

コラム 依存ファイルのコピー

サブメニューを追加するには

メニューの任意の項目を削除するには

不要なサブメニューを削除するには

コラム 「#」の設定

14.2.2 リンクの設定

リンクをさせない項目を設定するには

メニュー項目のリンク先を設定するには

14.3 アコーディオンWidgetの配置

14.3.1 アコーディオンWidgetの作成

ページ上にアコーディオンWidgetを配置するには

アコーディオンWidgetのラベルを設定するには

アコーディオンWidgetのコンテンツを入力するには

2番目のラベルとコンテンツを設定するには

アコーディオンWidgetの項目を追加するには

14.4 XMLデータベースと連携したWebアプリケーションの作成

14.4.1 XMLデータの作成

空白のXMLファイルを作成するには

XMLファイルの構造を確認する

XMLファイルにデータを入力するには

14.4.2 Spryテーブルの作成

データセットを作成するには

Spryテーブルを配置するには

Spryテーブルの動作を確認するには

Chapter15 Fireworks CS6によるイメージ・パーツの作成

15.1 Fireworks CS6の特徴

15.1.1 Fireworks CS6の機能

Fireworks CS6の機能を確認する

コラム スタートページを表示しないようにする

15.1.2 Fireworks CS6の画面構成

Fireworks CS6の画面構成を確認する

15.1.3 Fireworks CS6の起動と終了(Windows編)

Fireworks CS6を起動するには

Fireworks CS6を終了するには

15.1.4 Fireworks CS6の起動と終了(Macintosh編)

Fireworks CS6(Macintosh版)を起動するには

Fireworks CS6(Macintosh版)を終了するには

15.2 Fireworks CS6の基本操作

15.2.1 イメージの新規作成

サイズを指定して新規イメージを作成するには

15.2.2 イメージの保存

PNG方式でイメージを保存するには

JPEGファイルの圧縮率を指定して保存するには

コラム 読み込みに必要な時間の目安

イメージの一部を除いて圧縮するには

GIFファイルのサイズを小さくして保存するには

コラム GIFファイルにおける色数の設定

徐々に表示されるイメージを作るには

15.3 イメージの作成

15.3.1 図形の描画

四角形を描くには

15.3.2 図形の編集

図形の位置とサイズを変更する

コラム 円形のイメージを編集するには

図形のまわりに枠線を表示する

図形にシャドウを付ける

15.3.3 写真の編集

カラー写真をモノクロに変換する

写真に緊張感を付ける

PR

秀和システム