- Dreamweaver ユーザーガイド
- はじめに
- Dreamweaver と Creative Cloud
- Dreamweaver のワークスペースとビュー
- サイトの設定
- ファイルの管理
- レイアウトとデザイン
- CSS
- ページコンテンツとアセット
- ページプロパティの設定
- CSS 見出しプロパティおよび CSS リンクプロパティの設定
- テキストの操作
- テキスト、タグ、属性の検索と置換
- DOM パネル
- ライブビューでの編集
- Dreamweaver でのドキュメントのエンコード
- ドキュメントウィンドウでのエレメントの選択および表示
- プロパティインスペクターでのテキストプロパティの設定
- web ページのスペルチェック
- Dreamweaver での区切り線の使用
- Dreamweaver でのフォントの組み合わせの追加と変更
- アセットを使用した作業
- Dreamweaver での日付の挿入と更新
- Dreamweaver でのお気に入りアセットの作成と管理
- Dreamweaver でのイメージの挿入と編集
- メディアオブジェクトの追加
- Dreamweaver でのビデオの追加
- HTML5 ビデオの挿入
- SWF ファイルの挿入
- オーディオエフェクトの追加
- Dreamweaver での HTML5 オーディオの挿入
- ライブラリ項目の操作
- Dreamweaver でのアラビア語およびヘブライ語のテキストの使用
- リンクおよびナビゲーション
- jQuery Widget と効果
- web サイトのコーディング
- Dreamweaver でのコーディングについて
- Dreamweaver のコーディング環境
- コーディングの環境設定
- コードカラーリングのカスタマイズ
- コードの記述と編集
- コードヒントとコード補完機能
- コードの折りたたみと展開
- スニペットでコードを再利用する
- 構文チェックコード
- コードの最適化
- デザインビューでのコードの編集
- ページのヘッドコンテンツの操作
- Dreamweaver でのサーバーサイドインクルードの挿入
- Dreamweaver でのタグライブラリの使用
- Dreamweaver へのカスタムタグの読み込み
- JavaScript ビヘイビアーの使用(基本操作)
- JavaScript に組み込まれているビヘイビアーの適用
- XML および XSLT について
- Dreamweaver でのサーバーサイド XSL 変換の実行
- Dreamweaver でのクライアントサイド XSL 変換の実行
- Dreamweaver での XSLT の文字エンティティの追加
- コードのフォーマット
- 製品間ワークフロー
- テンプレート
- Dreamweaver テンプレートについて
- テンプレートおよびテンプレートから作成されたドキュメントの認識
- Dreamweaver テンプレートの作成
- テンプレート編集可能領域の作成
- Dreamweaver でのリピート領域およびテーブルの作成
- テンプレートの任意の領域の使用
- Dreamweaver での編集可能なタグ属性の定義
- Dreamweaver でネストされたテンプレートを作成する方法
- テンプレートの編集、更新、削除
- Dreamweaver での xml コンテンツの書き出しおよび読み込み
- 既存のドキュメントでのテンプレートの適用または削除
- Dreamweaver テンプレートでのコンテンツの編集
- Dreamweaver でのテンプレートタグのシンタックスルール
- テンプレート領域のハイライト表示の環境設定
- Dreamweaver でテンプレートを使用する利点
- モバイルとマルチスクリーン
- 動的サイト、ページおよび web フォーム
- web アプリケーションについて
- アプリケーション開発のためのコンピューター設定
- データベース接続のトラブルシューティング
- Dreamweaver での接続スクリプトの削除
- 動的ページのデザイン
- 動的コンテンツソースの概要
- 動的コンテンツのソースの定義
- ページへの動的コンテンツの追加
- Dreamweaver での動的コンテンツの変更
- データベースのレコードの表示
- Dreamweaver でのライブデータの入力とトラブルシューティング
- Dreamweaver でのカスタムサーバービヘイビアーの追加
- Dreamweaver を使用したフォームの作成
- フォームを使用したユーザーからの情報の収集
- Dreamweaver での ColdFusion フォームの作成と有効化
- web フォームの作成
- フォームエレメントの HTML5 サポート強化
- Dreamweaver を使用したフォームの開発
- アプリケーションのビジュアル開発
- web サイトのテスト、プレビュー、パブリッシュ
- トラブルシューティング
ライブビューやコードビューで、または PSD ファイルからテキストと関連するプロパティを抽出することにより、テキストを追加およびフォーマットする方法について説明します。
テキストのドキュメントへの追加
Dreamweaver ドキュメントにテキストを追加するには、 ドキュメントウィンドウにテキストを 直接入力するか、 テキストをカット&ペーストします。また、テキストを別のドキュメントから読み込むこともできます。
Dreamweaver ドキュメントに テキストをペーストする場合は、 「ペースト」または「ペーストスペシャル」コマンドを使用できます。「ペーストスペシャル」コマンドを使用すると、 ペーストされるテキストのフォーマットを 指定できます。例えば、フォーマットされた Microsoft Word ドキュメントから Dreamweaver ドキュメントにテキストをペーストするときに、 すべてのフォーマットを削除し、ペーストしたテキストに独自の CSS スタイルシートを適用するとします。 この場合は Word でテキストを選択し、 クリップボードにコピーしてから、「ペーストスペシャル」コマンドを使用して、テキストのみをペーストするオプションを選択します。
「ペーストスペシャル」コマンドを 使用して他のアプリケーションからテキストをペーストする場合は、 ペーストの環境設定を初期設定のオプションとして指定できます。
コードビューでは、Ctrl+V(Windows)または Command+V(Macintosh)を押すと、 常にテキストのみ(フォーマットなし)が ペーストされます。
-
以下のいずれかの操作を行って、 ドキュメントにテキストを追加します。
- Extract パネルを使用して、PSD コンポジションからテキストを抽出します。詳しくは、PSD ファイルからのテキストのコピーを参照してください。
- ドキュメントウィンドウにテキストを直接入力します。
- 他のアプリケーションからテキストをコピーし、Dreamweaver に切り替えてドキュメントウィンドウのデザインビューに挿入ポイントを置き、編集/ペーストまたは編集/ペーストスペシャルを選択します。
編集/ペーストスペシャルを選択することにより、いくつかのペーストオプションフォーマットを選択できます。
以下のキーボードショートカットを使用してペーストすることもできます。
ペーストオプション
ショートカットキー
ペースト
Ctrl+V(Windows)
Command+V(Mac OS)
ペーストスペシャル
Ctrl+Shift+V(Windows)
Command+Shift+V(Mac OS)
特殊文字の挿入
HTML では、一部の特殊文字を 名前または数字で表し、これを entity と呼びます。 HTML には、 著作権記号(©)、アンパサンド(&&)、 登録商標記号(®) などの文字のエンティティ名があります。各エンティティには、— などの名前と、それに対応する — などの数値があります。
HTML では、コードに山形カッコ <> が使用されるため、 「より大きい」または「より小さい」を表す特殊文字が Dreamweaver にコードと 解釈されないよう配慮する必要があります。この場合、 より大きい(>)には &gt; を使用し、 より小さい(<)には &lt; を使用します。
多くの古いブラウザーは、 大半の名前付きエンティティを正しく表示できません。
-
ドキュメントウィンドウで、 特殊文字を挿入する位置に挿入ポイントを置きます。
-
次のいずれかの操作を実行します。
挿入/HTML/文字から、文字の名前を選択します。
挿入パネルの「HTML」カテゴリで「文字」オプションを選択し、ポップアップメニューから文字を選択します。
注意:他にも多数の特殊文字を利用できます。目的の特殊文字を選択するには、挿入/HTML/文字/その他を選択するか、または、挿入パネルの「HTML」カテゴリーで「文字」ボタンをクリックし、「その他の文字」オプションを選択します。その他の文字を挿入ダイアログボックスから文字を選択し、「OK」をクリックします。
文字間のスペースの追加
HTML では、文字と文字の間に 使用できるスペースは 1 個だけです。 スペースを 2 個以上ドキュメントに追加するには、改行なしスペースを挿入します。改行なしスペースが自動的にドキュメントに 追加されるように環境設定を行うことができます。
区切りなしスペースの挿入
-
次のいずれかの操作を実行します。
挿入/HTML/特殊文字/区切りなしスペースを選択します。
Ctrl+Shift キー(Windows)または Option キー(Mac OS)を押しながらスペースキーを押します。
挿入パネルで「HTML」を選択し、「文字」ボタンをクリックして「改行なしスペース」オプションを選択します。
環境設定による区切りなし スペースの追加
-
編集/環境設定(Windows) または Dreamweaver/環境設定(Macintosh)を選択します。
-
「一般」カテゴリで「複数の連続したスペースを許可」が オンになっていることを確認します。
段落スペースの追加
Dreamweaver の操作は、 多くのワードプロセッサーアプリケーションの操作に似ています。 新規の段落を作成するには Enter キー(Windows)または Return キー(Macintosh)を押します。Web ブラウザーでは、 段落間に空白のスペース行が自動的に挿入されます。段落間にスペース行を追加するには、 改行を挿入します。
段落区切りの追加
-
Enter キー(Windows)または Return キー(Macintosh)を押します。
改行の追加
-
次のいずれかの操作を実行します。
Shift+Enter キー(Windows)または Shift+Return キー(Mac OS)を押します。
挿入/HTML/特殊文字/改行を選択します。
挿入パネルで「HTML」を選択し、「文字」ボタンをクリックして「改行」を選択します。
ブレットリストおよび番号リストの作成
番号リスト、ブレットリスト、および定義リストは、 既存のテキストから、またはドキュメントウィンドウで新たにテキストを 入力しながら作成することができます。
定義リストは、 ブレットポイントや番号など項目リストの先頭に付ける文字を使用しないもので、 用語集や説明に使用されます。リストはネストすることもできます。 ネストしたリストとは、リストの中に別のリストが含まれているリストのことです。例えば、 番号リストまたはブレットリストを別の番号リストの中に ネストすることができます。
リストプロパティダイアログボックスを使用して、 リスト全体または個々のリスト項目の外観を 設定します。個々のリスト項目またはリスト全体に対して、 番号スタイルの設定、番号のリセット、ブレットスタイルオプションの設定を行うことができます。
新しいリストの作成
-
Dreamweaver ドキュメントで、 リストを追加する位置に挿入ポイントを置き、 以下のいずれかの操作を行います。
HTML プロパティインスペクターで、「番号付きリスト」または「リスト項目」をクリックします。
挿入/HTML を選択し、「リスト」(ブレットリスト)、「番号リスト」から目的のリストタイプを選択します。
指定したリスト項目の先頭に付く文字が、ドキュメントウィンドウに表示されます。
-
リスト項目のテキストを入力します。 Enter キー(Windows)または Return キー(Macintosh)を押すと、次のリスト項目が作成されます。
-
リストの作成を終了するには、Enter キー(Windows) または Return キー(Macintosh)を 2 回押します。
既存のテキストからのリストの作成
-
リストに変換する 一連の段落を選択します。
-
挿入/HTML で、「リスト」、「番号リスト」、「リスト項目」のいずれかを選択します。
ネストしたリストの作成
-
ネストするリスト項目を選択します。
-
右クリックして、リスト/インデントを選択します。
Dreamweaver によってテキストがインデントされ、元のリストの HTML 属性を使用して 別のリストが作成されます。
-
上記と同様の手順で、インデントされたテキストに 新しいリストのタイプまたはスタイルを適用します。
リスト全体に対するリストプロパティの 設定
-
ドキュメントウィンドウで、 少なくとも 1 つのリスト項目を作成します。リスト項目を追加すると、 新しいスタイルが自動的に適用されます。
-
リスト項目のテキスト内で挿入点を選択し、右クリックしてリスト/プロパティを選択します。リストプロパティダイアログボックスが表示されます。
-
リストを定義するオプションを設定します。
リストタイプ
リストのプロパティを指定します。 これに対して、「リスト項目」ではリスト内の個々の項目を指定します。ポップアップメニューから、 「ブレットリスト」、「番号リスト」、「ディレクトリリスト」、または「メニューリスト」を選択します。「リストタイプ」の設定に従って、 異なるオプションがダイアログボックスに表示されます。
スタイル
番号リストまたはブレットリストに 使用する数字またはブレットのスタイルを設定します。リスト内の項目に対して 別のスタイルを指定した場合を除き、リストの全項目にこのスタイルが適用されます。
カウントの開始
番号リストの最初の項目の値を設定します。
-
「OK」をクリックし、選択結果を設定します。
リスト項目のリストプロパティの 設定
-
ドキュメントウィンドウで、 設定を反映するリスト項目のテキストに挿入ポイントを置きます。
-
右クリックし、リスト/プロパティを選択します。
-
「リスト項目」で、定義するオプションを設定します。
新規スタイル
選択したリスト項目のスタイルを指定します。新規スタイルメニューに表示されるスタイルは、 リストタイプメニューに表示されるリストのタイプに 関連付けられています。例えば、リストタイプメニューに「ブレットリスト」が表示されている場合は、 新規スタイルメニューで選択できるのはブレットの オプションのみです。
カウントをリセット
番号リストの最初の項目の番号を設定します。
-
「OK」をクリックし、オプションを設定します。
テキストの検索と置換
テキストの検索と置換について詳しくは、テキストの検索と置換を参照してください。
省略形と頭字語の定義
HTML には、ページで検索エンジン、スペルチェッカー、 言語翻訳プログラム、スピーチシンセサイザに使用する省略形と 頭字語を定義できるタグが用意されています。 例えば、ページの省略形 ME(mechanical engineer)は 機械エンジニアを表し、頭字語 WHO(World Health Organization)は 世界保健機関を表すように指定できます。
-
ページのテキストで省略形または頭字語を 選択します。
-
挿入/HTML/テキストオブジェクト/省略、 または挿入/HTML/テキストオブジェクト/頭字語を 選択します。
-
頭字語または省略形の全文を入力します。
-
英語、ドイツ語、イタリア語など、 言語を入力します。
コピー&ペーストの環境設定
編集/ペースト を使用して他のアプリケーションから テキストをペーストするときは、「ペーストスペシャル」の 環境設定を初期設定のオプションとして設定することができます。 例えば、常にテキストをテキストのみとしてペーストする場合や、 基本的なフォーマットが適用されたテキストとしてペーストする場合は、 環境設定ダイアログボックスの「コピー/ペースト」で初期設定オプションを設定できます。
Dreamweaver ドキュメントに テキストをペーストする場合は、「ペースト」または 「ペーストスペシャル」コマンドを使用できます。「ペーストスペシャル」コマンドを使用すると、 ペーストされるテキストのフォーマットを指定できます。例えば、フォーマットされた Microsoft Word ドキュメントから Dreamweaver ドキュメントにテキストをペーストするときに、 すべてのフォーマットを削除し、ペーストしたテキストに独自の CSS スタイルシートを 適用するとします。この場合は Word でテキストを選択し、クリップボードにコピーしてから、 「ペーストスペシャル」コマンドを使用して、 テキストのみをペーストするオプションを 選択します。
環境設定ダイアログボックスの 「コピー/ペースト」で設定された環境設定は、 デザインビューでペーストされる内容のみに適用されます。
-
編集/環境設定(Windows)または Dreamweaver/環境設定(Macintosh)を選択します。
-
「コピー/ペースト」カテゴリをクリックします。
-
次のオプションを設定して、「OK」をクリックします。
テキストのみ
書式設定されていないテキストをペーストできます。元のテキストがフォーマットされている場合、 改行と段落を含むすべてのフォーマットが 削除されます。
構造(段落、リスト、テーブル)付きテキスト
構造を維持しているが、基本的なフォーマットを 維持していないテキストをペーストできます。例えば、テキストをペーストして、段落、リスト、 およびテーブルの構造を維持し、ボールド、イタリック、 およびその他のフォーマットを維持しないようにできます。
構造と基本書式(ボールド、イタリック)付きテキスト
構造化された HTML フォーマットテキストと 単純な HTML フォーマットテキストの両方 (段落やテーブルの他に、b、i、u、strong、em、hr、abbr、 acronym の各タグで書式設定されたテキストなど)をペーストできます。
構造と完全な書式(ボールド、イタリック、スタイル)付きテキスト
すべての構造、HTML フォーマット、および CSS スタイルを維持したテキストをペーストできます。
注意:「構造と完全な書式(ボールド、イタリック、スタイル)付きテキスト」オプションでは、外部スタイルシートの CSS スタイルは維持されません。また、スタイルのペースト元となるアプリケーションでクリップボードへのペースト時にスタイルが維持されない場合も、CSS スタイルは維持されません。
改行を維持
ペーストするテキストで改行を維持します。「テキストのみ」を選択した場合、 このオプションは無効になります。
Word の段落スペースのクリーンアップ
「構造と基本書式(ボールド、イタリック)付きテキスト」を選択し、 テキストをペーストするときに段落間の余分なスペースを削除する場合は、 このオプションを選択します。
スマート引用符をストレート引用符に変換 スマート引用符をストレート引用符に変換します。