DW 中国スーパーリーグのための 48 の実践的なヒント (共有)

この記事では、48 の dreamweaver の超実践的なスキルを紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

関連する推奨事項: 「dreamweaver チュートリアル」

DW の 48 の超実践的なスキル

1. Dreamweaver 4.0 を使用して、自動的に柔軟に調整される Web ページを簡単にデザインします。

最初にページのコンテンツが表形式であることを確認してから、編集するページを開いて を押します。 「Ctrl F6」 またはメニュー「View→TableView→Layout? View」でレイアウトビューに切り替わります。このとき、セルの列幅が表示されます。列幅の数値の横に小さなドロップダウン矢印があります。フレキシブル表示に設定したい列の上にある小さな矢印をクリックし、「列を次のように設定」を選択します。フレキシブル ディスプレイ" "(列を自動ストレッチする)。列ボックスの上に、列幅を示す数値の代わりに波線が表示されます。完了すると、ページはフレキシブル ページになります。また、ページ内に大きすぎる画像を含めないよう注意してください。

******************************************* **** ******************

********************** ******** ******************************

2. Dreamweaver 4.0 を使用して、点滅効果のある Flash ボタンを作成する

メニューの「挿入」→「インタラクティブ?画像」→「Flash?ボタン」を選択して、どの埋め込みボタンがあるかを確認します。ポップアップ ダイアログ ボックスの「スタイル」リストから希望のボタン スタイルを選択し、そのスタイルの効果をプレビュー (サンプル) ウィンドウで確認できます。選択後、「ボタン?テキスト」ウィンドウでボタン上のテキストを入力、「フォント」ウィンドウでフォントを選択、「サイズ」ウィンドウで文字サイズを入力、「リンク」にリンク先を入力します。リンクの開き方を選択し、「BgColor」でボタンの背景色を選択し、「名前を付けて保存」ウィンドウに保存するファイル名を入力します。ここまで完了したら「OK」ボタンを押せばFlashボタンの完成です。このボタンは Web ページにも自動的に挿入されます。次に、Dreamweaver 編集ウィンドウで作成したボタンを選択します。プロパティ ウィンドウにボタンのプロパティが表示されます。上の [再生] ボタンをクリックすると、ボタンを直接作成できます。編集ウィンドウで、このボタンの点滅効果をプレビューします。 Dreamweaver 4.0 のこの機能は中国語フォントをサポートしていないことに注意してください。

******************************************* **** ******************

********************** ******** ****************************

3. Dreamweaver 4.0 でキーボード ショートカットをカスタマイズする

メニュー「編集→キーボード?ショートカット」を選択すると、ダイアログボックスに現在有効で変更可能なショートカットキーの一覧が表示されますので、ここで使い慣れたショートカットキーに変更することができます。ショートカットキーを変更したい場合は、まず変更したいコマンドを選択し、次に現在のショートカットキーを選択します。ショートカットキーが「ショートカット」リストに表示され、「」に使用したいショートカットキーを入力します。 「キーを押して」ウィンドウを表示し、「変更」ボタンをクリックして変更を完了します。 「 」および「-」ボタンを使用して、現在のショートカット キーを追加または削除することもできます。

******************************************* **** ******************

********************** ******** ******************************

4. Dreamweaver 4.0 を統合します。 Fireworks を使用する場合

Dreamweaver/Fireworks が同時にコンピュータにインストールされている場合は、Dreamweaver? 4.0 が提供する Fireworks 統合機能を使用できます。この機能を使用すると、GIF 画像をより魅力的に変更し、アニメーション効果を簡単に実現できます。 Dreamweaver の編集ウィンドウで変更したい GIF 画像を選択し、画像のプロパティ ウィンドウで [編集] ボタンをクリックすると、Fireworks ソフトウェアが自動的に起動して画像を編集します。よく見ると、Fireworks の画像編集ウィンドウに Editing?From?Dreamweaver というテキストとパターンが表示されていることがわかります。これは、この画像が Dreamweaver ページでの画像編集用であることを意味します。 Fireworks で編集する画像を選択し、メニュー「修正→アニメーション→選択範囲をアニメーション化」を選択します。ポップアップ ウィンドウでアニメーションのプロパティを設定します。選択したアニメーションのフレーム数、アニメーションの移動方向、透明度など。次に、変更したファイルをエクスポートします。このようにして、Dreamweaver 編集ウィンドウは、変更したばかりのファイルを自動的に更新し、ページの画像を動かします。

******************************************* **** ******************

********************** ******** ****************************

5. ウェブレポーターの使い方Dreamweaver の

? 4.0 には、Web サイトの多数のファイル内のエラーを迅速に見つけて修正できる Web サイト レポーターが用意されています。メニュー「サイト→レポート」をクリックしてレポーターを起動し、確認したい項目を選択して「実行」ボタンをクリックすると、Web サイト上の一般的な問題が見つかります。また、独自のレポーターを作成して、Web サイト上の特定の問題を検出することもできます (一般的な問題は、通常、一部のテキストが欠落しているか、ドキュメントに名前が指定されていないことです)。

********************************************** ***** ***********

*************************** ****** **************************

6. 複数の操作を迅速に復元する

場合ページを作成していると、常にページを変更する必要があり、場合によっては過去の操作を復元する必要があります。[編集] メニューの [元に戻す] コマンドを使用できますが、このコマンドは一度に 1 回しか復元できません。複数の操作を復元する必要がある場合、毎回「元に戻す」必要があるのは非常に面倒です。 Dreamweaver 4.0 では履歴ウィンドウが提供されており、複数の操作を簡単に復元できます。 「Windows」メニューの「履歴」を選択すると、この履歴ウィンドウが開きます。このウィンドウでは、実行したすべての操作が保持され、ウィンドウの左側にあるスライド ポインタを使用して、保存された操作を含むすべての操作を継続的に復元したり元に戻したりすることができます。また、この履歴記録を保存して共有することもできます。

******************************************* **** ******************

********************** ******** ****************************

7. フローティングパネルを非表示にする

Dreamweaver を開いて第一印象を与えるのは、大量の浮遊パネルであり、しばしば目がくらんでしまいます。ドラッグして取り除くことはできますが、占有する画面は結局のところ非常に限られています。閉じてしまうと、再度開く必要があります。使用するとき。実際、F4 キーを 1 回押すだけで、すべてのフローティング パネルが消え、もう一度 F4 キーを押すと、すべてのパネルが画面に再び表示されます。

******************************************* **** ******************

********************** ******** ****************************

8. Web ページをすばやくプレビューする

Dreamweaver を初めて使用する場合、プレビュー メニューがないと、Web ページの実際の効果をプレビューするために IE ブラウザを起動する必要があることがよくあります。実はDreamweaverのプレビューメニューは「ファイル」メニューの下にあり、F12キーを押すだけで編集中のWebページをプレビューできるのでとても便利です。別のブラウザでプレビューするように設定することもでき、[ファイル] メニューの [ブラウザでプレビュー] で [ブラウザ リストの編集] を選択し、プレビュー用に別のブラウザを選択します。 Web ページのさまざまなブラウザーへの適応性をテストするため。

******************************************* **** ******************

********************** ******** ******************************

9. 行番号と表示HTML インスペクターでの自動行折り返し

Dreamweaver のビヘイビアは小さな JavaScript プログラムのマクロ コレクションですが、特別な Web ページ効果を実現する多くの JavaScript プログラムは手動プログラミングを必要としません。プログラムで特に行番号を表示する必要がある場合、プログラムでエラーが発生した場合、「○○行でエラーが発生しました」というプロンプトが表示されることがよくありますが、行番号を一行ずつ数えると、それだけではありません。 FrontPage では、行番号を数え間違えることを常に心配します。 Dreamweaverではこれが便利で、HTMLソースコードビューア画面の「行番号」にチェックを入れておくと、ソースコードビューア画面のHTML文ごとに行番号が自動的に表示され、一目瞭然になります。 . .同様に、コード行が長くなることがあります。HTML ソース コード ビューア ウィンドウで「ワープ」（自動行折り返し）チェック ボックスがオンになっている限り、ウィンドウの自動行折り返し機能が有効になり、長すぎるコードはコードは自動的にウィンドウの端に折り返されます。

******************************************* **** ******************

********************** ******** *******************************

10. 入手方法色の 16 進数コード

Web ページをデザインするとき、16 進数のカラー コードが使用されることがあります。以前はこれについて頭を痛めていました。Dreamweaver では、次に小さなボックスの右下隅にある小さな三角形を押してください。プロパティパネルの「bg」に、ポップアップカラーでボード上のどこにマウスを置くと、対応する色の16進コードがすぐに表示されるのでとても便利です。

******************************************* **** ******************

********************** ******** ******************************

11. バックグラウンドミュージックを作成する

Dreamweaver Music で背景を挿入するのは非常に簡単です。ここでは 2 つの方法から選択できます。

(1) ページ上の目立たない場所に空のレイヤーを挿入し、その中に ActivX オブジェクトを配置し、ダブルクリックして表示されるダイアログで MIDI 音楽ファイルを選択し、レイヤー オブジェクトのプロパティ パネルでの表示設定を「非表示」に設定し、変更を保存して F12 キーを押して Web ページをプレビューし、音楽があるかどうかを確認します。

(2) もう 1 つの方法は、Dreamweaver の「動作」動作エディターを使用し、「+」ボタンをクリックし、「サウンドの再生」オプションを選択して、ポップアップ ダイアログ ボックスで音楽ファイルを選択することです。 。あなたも試してみてください！

******************************************* **** ******************

********************** ******** ****************************

12. 背景画像がスクロールしないようにする

FrontPage とは異なり、Dreamweaver に挿入された背景画像はテキストとともにスクロールします。固定の背景画像を作成する必要がある場合がありますが、どうすればよいでしょうか?まず背景画像を定義し、「F10」を押して HTML ソース ファイルを開き、background="images/background.JPG" などの背景画像を定義するステートメントを見つけて、空白に bgproperties="fixed" という文を追加します。その後のスペース。プレビューして、ちょっとした達成感を感じてください。

******************************************* **** ******************

********************************************** ***** *************

13. サイズが変わらないテキストを定義する

他の人の Web ページのテキストがそのように見えるのはなぜですか美しい、ブラウザのフォント ボタンをどのように押しても、フォント サイズは変わりません。実際、Web ページでは「CSS」スタイル シート テクノロジが使用されており、Dreamweaver でこの機能を実装するのは非常に簡単です。まず「F7」を押すか、「ウィンドウ」メニューの「スタイルシート」オプションを選択してスタイルシートエディタを開き、ウィンドウ内で右クリックして「新規」を選択し、必要なスタイルシートの名前を入力します。 [OK] を押して、リストの最初の項目 [タイプ] を選択し、特定のテキスト属性のパラメータを定義します (一般的に、ポップアップ ダイアログ ボックスでテキスト サイズとして 10.5 を選択する方が適切です) 800×600 の画面) 「OK」を押すと、定義されたスタイルシートが表示されます。 Web ページ編集ウィンドウでテキストを選択し、新しいスタイル シート名をクリックすると、選択したテキストの変更が表示されます。プレビューして、定義されたテキストのフォント サイズがブラウザーで選択したフォント サイズに応じて変更されるかどうかを確認してください。

******************************************* **** ******************

********************** ******** ******************************

14. Flash アニメーションの挿入

マクロメディアのFlashアニメーションは、そのインタラクティブ性と通信速度の速さから、Webページ制作の新たな武器となりつつあり、WebページにFlashアニメーションを挿入できれば、作品がより華やかになること間違いなしです。 。 Flash で作成した SWF 形式のアニメーションを Dreamweaver に挿入するのは非常に簡単で、オブジェクトツールバーの Flash ロゴをクリックするか、「メディア」の「Flash」をクリックすると、SWF アニメーション ファイルを選択するダイアログ ボックスが開き、ファイルを選択することができます。プロパティ パネルで再生パラメータを設定すれば完了です。

******************************************* **** ******************

********************** ******** ******************************

15. 表は空白のままにしておきます。 Web ページ上

Dreamweaver の場合 新しい Web ページにテキストを入力する場合、デフォルトの形式は圧倒的で非常に見苦しいです。誰もがテーブル ツールをうまく使用している限り、この欠点を回避するのは実際には非常に簡単です。具体的な方法は、新しいページに中央揃えの表を挿入します。表を制御しやすくするためには、奇数の列を設定し、値が大きすぎないようにするのが最善です。このように、セルに入力されるテキストは幅を自由に調整できる領域に限定されるため、テキストが制御不能になることを心配する必要はありません。

******************************************* **** ******************

********************** ******** ******************************

16. ステータスバーを変更するプロンプト テキスト

通常、ブラウザがページを読み込むと、ページのアドレス名がステータス バーに表示されますが、これは非常に退屈です。ブラウザのステータス バーに少し個性を加えたいと考えたことはありますか?その場合は、以下の手順に従って、お好みのテキストをカスタマイズしてください。まず、[動作] 動作編集ウィンドウを開き、[+] ボタンをクリックし、[テキスト セットの設定] で [ステータス バーのテキスト] オプションを選択し、ボックスに「ホームページへようこそ」などの独自のテキストを入力します。 「 」などを選択して「OK」をクリックします。

******************************************* **** ******************

********************** ******** ******************************

17. 統合されたテキスト コード エディター

ビジュアル Web ページ 編集ソフトウェアの最大の不便な点は、JavaScript はもちろんのこと、ソース コードの編集が難しいことですが、Dreamweaver を使用するとコードの扱いが非常に簡単になります。この組み込みのテキスト コード エディターの主な新機能は、自動インデント (一度に複数行を選択してインデントできます)、記号の検出も可能です。コードを書くときに "" を忘れた場合は、ヒントが表示されます。 。ツール リストのドロップダウン メニューには、現在の Web ページでカスタマイズされたすべての JavaScript< /I> 関数が一覧表示され、Web ページの元のコードに自由にジャンプできます。「ソース コード ナビゲーション ツール」を使用すると、専門家が JavaScript< を簡単に処理できます。 ; /I> 関数では、テキスト コード エディターに JavaScript コードを入力すると、システムによって異なる色で表示されます。

******************************************* **** ******************

********************** ******** ******************************

18. に複数のスペースを入力します。 Dreamweaver

us 通常入力するスペースは半角ですが、Dreamweaverでは1つしか入力できませんので、複数入力したい場合は全角スペースを入力してください。全角スペースを入力する方法は、中国語入力方法を開き、Shift Spaceを押して全角状態に切り替えます。このとき入力するスペースは全角スペースです。

******************************************* **** ******************

********************** ******** ****************************

19. Dreamweaver の BUG# の 1 つを解決します。 ##

Dreamweaver 3.0 の動作インスペクタでは、[イベント] ドロップダウン メニュー項目を開くことができません。その結果、多くの特殊効果は役に立たず、まったく生成できません。実際、これは Dreamweaver 3.0 と中国語版 Windows98 との間の非互換性と考えるべきであり、英語版 Windows98 にはこの問題は存在しません。実際、このメニューは開くことはできますが、正しく表示されません。ドロップダウン メニューを選択した後、上下キーを使用して使用するブラウザを選択できます。

******************************************* **** ******************

********************** ******** ****************************

20. Dreamweaver 3.0 テンプレートを使用して、 Web ページの作成と動作の設定 (Behavior)

テンプレートを使用して作成された Web ページに新しい動作を追加することはできません。これは、新しい動作では HTML ファイルの Head 部分に JavaScript を挿入する必要があり、Template を使用した後、HTML ファイルの Head 部分が「ブロック」されるためです。テンプレートを使用して生成されたWebページに動作を適用したい場合は、テンプレート内で動作を事前に定義し、テンプレートの編集可能領域として定義する必要があります。その後、Web ページでこの動作を変更できます。ただし、これは、トリガーとなるイベント (イベント) と動作のアクション (アクション) の特定の内容を変更する場合にのみ限定され、アクションの種類は変更されません。

******************************************* **** ******************

********************** ******** ******************************

21. テキストに動作を適用する動的なテキスト効果を作成します

Dreamweaver では、通常のテキストは文字単位で測定されるため、オブジェクトとして使用できません。つまり、一部の非常に便利な JavaScript イベントをテキストに割り当てることができません。テキストには画像やその他のコントロールのような特定の「マーク」がないため、テキストには多くの特殊効果が欠けています。テキストに特殊効果を加えるには、テキストをハイパーリンクにするしか対処方法がありません。このようにして、テキストはオブジェクトとなり、アクションを強制することができます。ただし、これにより、下線などの不要なハイパーリンク属性や、ホバーや訪問済みなどの色の変更が発生します。単純にテキストに特殊効果を追加したい場合は、まず設定したいテキストをハイパーリンクにし、次にその上に動作を追加し、最後にハイパーリンクを通常のテキストに変換します。具体的な手順は次のとおりです。

編集するテキストを選択し、リンク ターゲット ボックスにいくつかの文字を入力します。このリンクを選択し、「Windows」→「Behaviors」をクリックすると、「Behaviors」パネルがポップアップ表示されます。 「 」を押してサウンドの再生など、必要な動作を追加します。 Dreamweaver ハイパーテキスト エディターを開き、このリンクを見つけて、次のように変更します。最後に「href=...」を削除します。このページを保存します。 F12 を押してプレビューします。効果も悪くない！

******************************************* **** ******************

********************** ******** ******************************

22. 位置を正確に特定するWeb ページ内の各要素の位置を確認する

Web ページ上の個々の要素の位置を特定するには、テーブルを使用するか、レイヤーを使用するかの 2 つの方法があります。現在、表を使用するのが一般的ですが、具体的な方法としては、まず Web ページ上に表を作成し、表の枠線の幅を 0 にする必要があります。次に、要件に従って各テーブルのセルに各要素を配置します。表のセルのサイズと表の境界線の位置を慎重に調整すると、表のセル内の要素もそれに応じて移動します。このようにして、Web ページ内の各要素の位置をより正確に特定できます。テーブルを使用する利点は、テーブルが汎用的であり、ブラウザのほぼすべてのバージョンでテーブルをサポートできることです。欠点は、使用が面倒で、慎重な調整が必要で、位置決めがあまり正確ではないことです。レイヤーは Web ページ内のどこにでも配置できるため、レイヤーを使用して正確な位置を決めることができます。使用方法は、Webページにレイヤーを挿入し、そのレイヤー内に配置したい要素を配置することで、任意の場所にレイヤーを配置できます。さらに、定規やグリッドを使用して正確な位置を決めることができます。レイヤーは最新のブラウザーでのみサポートされているため、古いブラウザーと互換性を持たせるために、レイヤーをテーブルに変換できます。方法は「修正→レイアウトモード→レイヤーをテーブルに変換」を選択します。このときレイヤーは重なることができないので、レイヤーを挿入する前に「表示→レイヤーの重なりを防ぐ」を選択すると、レイヤーの重なりを避けることができます。一般的に、変換されたページには変更が加えられる可能性があり、手動で調整する必要があります。最後に注意すべき点は、テーブルとレイヤーを変換する場合、ページが乱雑になる可能性があるため、1 つのページでレイヤーとテーブルを同時に使用しないことをお勧めします。マウスの形状

これは、スタイル シートを編集することで実現されます。具体的な方法は、「テキスト（テキスト）→カスタムスタイル（CSSスタイル）→スタイルシートの編集（スタイルシートの編集）」を選択すると、スタイルシートの編集画面が表示されるので、その中の「新規（新規）」を選択します。次に、「カスタム スタイルの作成」を選択し、スタイル シートに名前を付けて、「OK」をクリックします。スタイルシートを編集し、拡張子を選択し、右側のカーソル項目（Cursor）に表示するポインター効果を選択します。

********************************************** ***** ***********

*************************** ******** *************************

24. ハイパーリンク テキストの下の下線を削除します

この効果は、スタイル シートを編集することで実現されます。具体的な方法は、「テキスト（text）をクリック→スタイルをカスタマイズ（CSS Style）→スタイルシートを編集（Edit Style Sheet）」すると、スタイルシートの編集画面が表示されるので、「新規（new）」を選択します。次に、[HTML タグの再定義] を選択し、下の [タグ] メニューで を選択します。スタイル シートを編集し、タイプを選択し、右側の装飾で [なし] を選択します。

******************************************* **** ******************

********************** ******** ****************************

25. 以下の画像を作成します。 page

この 1 つの効果は JavaScript によって実現されます。一般に、このような効果を実現するには、特定のプログラミング スキルが必要ですが、Dreamweaver プラグインを使用して簡単に実現できるようになりました。このプラグインは、http://www.computerinfo.com.cn/classroom/chajian/chajian2.zip からダウンロードできます。プラグインのインストール方法: プラグインを解凍し、Dreamweaver の下の Configuration\Objects フォルダー内の新しいフォルダーにコピーします。 Dreamweaver を再起動すると、オブジェクト パネルに新しくインストールされたプラグインが表示されます。プラグインアイコンをクリックし、ポップアップダイアログボックスで画像保存アドレスと画像表示位置を入力します。

******************************************* **** ******************

********************** ******** ****************************

26. 変化する動的メニューを作成するマウスをその上に移動したとき

いわゆるダイナミック メニューは実際には 2 つの画像であり、1 つはマウスがその上に置かれていないときに表示され、もう 1 つはマウスを上に移動したときに表示されます。 Dreamweaver が提供するビヘイビアでスワップ画像を使用すると、この効果を実現できます。まず画像を挿入し、マウスでクリックし、プロパティパネルの接続欄に接続したいWebページを入力します。次に、動作パネルを開き、「 」記号をクリックして、画像の交換を選択します。すると、マウスを上に移動した後に表示される画像を選択する画面が表示されるので、ここで2番目の画像を選択して「OK」をクリックします。さて、エフェクトが完成しました、なんて簡単なことでしょう。

******************************************* **** ******************

********************** ******** ******************************

27. Dreamweaver を使用して作成しますドロップダウン メニューに似た効果

ドロップダウン メニューに似た効果を作成するには、レイヤーの非表示プロパティと表示プロパティを使用する必要があります。具体的な方法は、単一行、複数列の表をメニュー バーとしてページに挿入します。テーブル内の列の数は、メニュー オプションの数によって決まります。レイヤーを挿入し、レイヤーの最初のドロップダウン メニューの内容を入力し、このレイヤーをテーブルの最初の列の下に移動します。他のメニュー項目についても同様に、対応するレイヤーを挿入します。すべてのレイヤーの表示属性(vis)を非表示(Hidden)に変更します。

テーブルの最初のセルを選択し、[ウィンドウ] (Windows) → [動作] (動作) をクリックすると、動作パネルが表示されます。 「 」を押してレイヤーの表示/非表示の動作を追加し、最初のレイヤー (レイヤー 1) のプロパティを表示 (表示) に変更し、他のレイヤーのプロパティを非表示 (非表示) に変更します。次に、動作パネルでこの動作を編集し、そのトリガー イベント (イベント) を onMouseover に変更します。このようにして、マウスを最初の表のセル上に移動すると、最初のドロップダウン メニューが表示されます。次に、別の動作「レイヤーの表示/非表示」を追加し、すべてのレイヤーのプロパティを非表示に変更します。次に、動作パネルでこの動作を編集し、そのトリガー イベント (イベント) を onMouseout に変更します。これにより、マウスが最初の表のセルから離れると、最初のドロップダウン メニューが非表示になります。他のメニュー項目についても繰り返します。ただし、「メニュー 2」を設定すると 2 番目のレイヤーが表示され、他のレイヤーは非表示になり、「メニュー 3」を設定すると 3 番目のレイヤーが表示され、他のレイヤーは非表示になるという点に注意してください。完了しました。F12 を押して見てください。

******************************************* **** ******************

********************** ******** ****************************

28. ダウンロードファイルを簡単に作成

Dreamweaver の使い方は実はとても簡単です。簡単です。閲覧者にダウンロードしてもらいたいファイルの名前を書き、マウスをドラッグしてこのテキストを選択し、「リンク」属性入力ボックスにファイル名を書き込むだけです。テキスト属性パネル上。注: ダウンロードしたファイルが Web ページと同じディレクトリにない場合は、ファイル名に相対パスを含める必要があります。相対パスを含めないと、ダウンロード時にファイルが見つからないというメッセージが表示されます。

******************************************* **** ******************

********************** ******** ******************************

29. Dreamweaver のブックマークを使用して、ジャンプリンクを作成する

Dreamweaver のブックマークを使用してこの機能を実現できます。具体的な方法は、ジャンプしたい場所にカーソルを移動し、メニューの「挿入→ブックマーク（名前アンカー）」を選択し、ブックマークの名前を入力します。次に、リンクを呼びたいリンク先の欄に「#ブックマーク名」を記入するとページ内にジャンプリンクが完成します。ここで、ブックマーク名の前にWebページ名を入力すると、他のページのブックマークにジャンプします。たとえば、リンクに「index.htm#top」と入力すると、閲覧者がこのリンクをクリックすると、インデックス ページの先頭のブックマークにジャンプします。

******************************************* **** ******************

********************** ******** *******************************

30. 隙間を削除します。画像と表の接触

画像と表の間に隙間がないようにするには、表のプロパティ パネルで境界線を 0 に設定するだけでは十分ではなく、2 つのプロパティも設定する必要があります。テーブルのプロパティ パネルでセルの値を 0 に変更します (つまり、cellspacing="0" および cellpadding="0")。

******************************************* **** ******************

********************** ******** ******************************

31. TracingImage を使用して支援しますWeb ページ内の各要素の位置を特定します

TracingImage は Dreamweaver の非常に効果的な機能で、ユーザーは元のパターン デザインを Web ページの補助背景として使用できます。このようにして、ユーザーはページ上のテキスト、画像、表、レイヤー、その他の Web ページ要素を簡単に見つけることができます。 TracingImage の具体的な使用方法は次のとおりです。まず、さまざまな描画ソフトウェアを使用して、架空の Web ページのレイアウト図を作成し、それをネットワーク画像形式 (gif、jpg、jpeg、png を含む) として保存します。 Dreamweaver を使用して編集中の Web ページを開き、ページの空白領域を右クリックして [ページのプロパティ...] を選択し、作成したばかりの Web ページのレイアウト パターンの場所をトレースに入力します。ポップアップ ダイアログ ボックスの画像アイテム。あとはImage TransparenでTracingImageの透明度を設定すればOK。このようにして、現在の Web ページ内の各 Web ページ要素の位置を簡単に見つけることができます。 TracingImage を使用する Web ページは、Dreamweaver で編集すると背景パターンが表示されなくなります。ただし、ブラウザで閲覧すると、その逆になります。TracingImage が消え、編集された Web ページのみが表示されます (もちろん、背景パターンは表示されません)。表示されます）。

******************************************* **** ******************

********************** ******** ******************************

32. 「変換テーブル」について「幅をピクセルに変換」と「テーブルの幅をパーセントに変換」

「テーブルの幅をピクセルに変換」と「テーブルの幅をパーセントに変換」は、テーブルの幅を設定する Dreamweaver の 2 つの重要な機能です。テーブルを含む Web ページを開いたときに、ステータス バーの

ラベルをクリックすると、その後表示されるテーブル プロパティ ツール パネルにこれら 2 つのボタンが表示されます。名前が示すように、「表の幅をピクセルに変換」は表内のすべてのセルの幅をピクセルで表現し、「表の幅をパーセントに変換」は表内のすべてのセルの幅をパーセントで表現します。テーブルの幅がピクセル単位で表現されている場合、ブラウジング ウィンドウが拡大されても、テーブルはそれに応じてセルの幅を拡大しません。 「テーブルの幅をパーセントに変換」を使用すると、640×480 の解像度で作成した 100% 幅のテーブルを、より高い解像度でも 100% の幅を維持できます。したがって、この 2 つの機能を使いこなすことで、Web ページのレイアウトをより効率的に行うことができます。

******************************************* **** ******************

********************** ******** ******************************

33. 混乱のない通話スタイルWeb ページの元のコード

スタイルを呼び出すにはさまざまな方法があります。右クリックして Custon Style を選択してスタイル仕様を呼び出すことも、ステータス バーの要素リストを右クリックすることもできますスタイルを呼び出します。異なる方法で得られる効果は同じように見えますが、実際に生成される HTML コードはまったく異なります。たとえば、Custon Style を使用してスタイル仕様を呼び出すと、Web ページ コードに タグが生成されます。タグが多すぎると、ファイルが非常に肥大化し、ブラウザの解析速度に影響を与えるため、要素を使用することをお勧めします。ステータスバーのリストを可能な限り表示し、Style を呼び出します。もう 1 つの小さなトリックがあります。スタイルを使用して表のセル内のすべてのテキストを定義したい場合は、

タグを 1 つずつ定義するのではなく、

タグでスタイルを呼び出すだけです。 タグの Style で定義されたテキスト形式は Netscape によって無視されるため、このメソッドは タグには適用されないことに注意してください。

******************************************* **** ******************

********************** ******** ******************************

34. カスタム ウィンドウを使用するさまざまな解像度で Web ページの効果をテストする機能

苦労して作成した Web ページが、解像度が変わると認識できなくなるのは誰も望んでいません。そのため、Web ページの閲覧効果をさまざまな解像度でテストすることは、Web ページ制作において非常に重要なステップとなります。 Dreamweaver の操作インターフェイスのステータス バーの中央で必要な解像度を選択することでウィンドウ サイズを調整し、さまざまな解像度で Web ページの効果をテストできます。

******************************************* **** ******************

********************** ******** ******************************

35. 使用する必要はありません。 Web サイトをアップロードする際のサードパーティ製 FTP ソフトウェア

Dreamweaver には FTP 機能が組み込まれており、Web サイトのアップロード用に最適化されています。簡単に比較してみますが、一般的なFTPソフトでWebサイトをアップロードする場合、ローカルマシン上のWebサイトのディレクトリに合わせてサーバー内に新しいディレクトリを作成し、ファイルを1つずつアップロードしていますか？このアプローチは確かに正しいですが、ローカル マシン上の Web サイト ディレクトリ内のすべてのファイルが Web ページによって呼び出されるわけではないため (Web ページの構築時に残されたバックアップ ファイルなど)、ファイルのフィルタリングの負荷がどれほど重いかはユーザーだけが知っています。ただし、Dreamweaver を使用して Web ページをアップロードする方がはるかに便利です。FTP 機能がユーザーに必要な多くの作業をバックグラウンドで実行するため、ユーザーはサイト マップ内の関連する HTML ファイルをアップロードするだけで済み、Dreamweaver が自動的にアップロードします。関連するすべての HTML ファイルを Web サイトにアップロードし、他のローカル ファイル (画像、ZIP ファイル、FLASH ファイル、さらにはさまざまな REAL ファイルなど) を一緒にアップロードします。 Dreamweaver に含まれる FTP 機能の具体的な使用方法は、定義した SITE を編集し、「サイト定義...」パネルで「Web サーバー情報」を選択します。 Web ページが FTP 経由でアップロードされる場合は、「サーバー アクセス」を FTP に設定し、FTP ホストに FTP サーバーのアドレスを追加し、ホスト ディレクトリにリモート ログイン ディレクトリを追加し、ログインにユーザー名を追加して入力します。パスワード。上記の設定後、[サイト] パネルの [接続] ボタンを押すと、Dreamweaver がサーバーに正常に接続すると、[接続] ボタンが自動的に [切断] に変わり、その横にある小さな緑色のライトが点灯します。次にアップロードするHTMLファイルを右クリックし、「Put」を選択します。 HTML ファイルが正常にアップロードされると、「Put Depanding File」がステータスバーに表示され、Dreamweaver がこの HTML ファイルによって呼び出される他のローカル ファイルをアップロードしていることを示します。それだけでなく、Dreamweaver ではファイルをサーバーに直接ダウンロードして変更することもできます。その方法は? Put の横にある Get ボタンを試してみることです。

******************************************* **** ******************

********************** ******** *******************************

36. 効果を得るにはリンクをマウスでポイントしたときに表示される下線の状況

Web ページへのリンクの中には、元々下線が引かれていないものもあります。リンクにマウスを置くと下線が表示され、マウスを離すと下線が消えます。また。この効果は、実際には Cascading Style Sheets (CSS) を使用することで実現できます。Dreamweaver 上で Cascading Style Sheets を編集するためのコードを記述する必要はありません。具体的な操作方法は次のとおりです。

(1) Cascading Style Sheets をクリックします。クイック起動バーのシートボタン（「CSS スタイルを表示」と表示されるボタンの上にマウスを置きます）、ポップアップの CSS スタイルパネルをダブルクリック（なし）;

(2) このとき, ポップアップの [スタイル シートの編集] パネルが表示されるので、このパネルの [新規] ボタンを押します;

(3) 次に、ポップアップの [新しいスタイル] パネルで [HTML タグの再定義] (HTML タグの再定義) をクリックします。タグで「a」(ハイパーリンクタグ)を選択し、マーク後OKボタンを押します (4) このとき、スタイル定義ダイアログがポップアップ表示されます。このダイアログでは、多くの属性を設定できます。必要に応じて設定できますが、ここでは主に迷惑な下線を削除したいので、装飾属性で「なし」を選択し、下線を削除し、色 #339966 を選択します。 [OK] ボタンを押して [スタイル シートの編集] パネルに戻ります;

(5) [スタイル シートの編集] パネルの [新規] ボタンを押します;

(6) ポップアップで [CSS を使用] をクリックします新しいスタイル パネル セレクターを選択し、パネル上のセレクター選択ボックスで「a:hover」を選択し (マウスがハイパーリンク上にあるときのリンクのプロパティを定義します)、OK ボタンを押します;

(7)ポップアップのスタイル定義で、[for a:hover] ダイアログ ボックスで、装飾属性で [underline] を選択し、下線が追加されるようにし、色 #FF3300 を選択します。 [OK] ボタンを押して [スタイル シートの編集] パネルに戻ります;

(8) [スタイル シートの編集] パネルでもう一度 [ドン] ボタンを押すと、すべての設定が完了します。 Dreamweaver ソース コード ビュー ウィンドウ。以下に示すコード:

37. 定義されたハイパーリンク テキストの色を実装します。

テキスト ハイパーリンクの色 (未訪問のリンクの色、マウス リンクの色を含む) 、訪問したリンクの色など）は、CSS（Cascading Style Sheets）を使用して定義できますが、テキストリンクの色を好みに設定する方法を説明します。

(1) ハイパーリンクのデフォルトの色は次のとおりです: 未訪問のハイパーリンクは青、訪問済みのハイパーリンクは紫です;

(2) CSS を使用して色の動作を定義する場合は、入力しないでください。ハイパーリンク テキストの color 属性の内容;

(3) テキストの色を定義していて、CSS で定義したハイパーリンクの色が機能しないことがわかった場合は、テキストの色の定義をキャンセルするか、ハイパーリンクをキャンセルして再定義すると、定義された色がCSS は機能します。機能します;

(4) さまざまな状態でのハイパーリンクのテキストの色の関係: 訪問したリンクの色が定義されると (A: 訪問済み)、リンクが訪問されたとき、リンクの色 色は変更されなくなります。つまり、ハイパーリンク (a: ホバー) 上のマウスの色の定義は機能しなくなります。訪問先リンクの色が定義されていない場合 (A: 訪問先)、マウスがハイパーリンク上にある場合は a: hover で定義された色が表示され、マウスが離れると a: で定義された色が表示されます。

上記からもわかるように、テキストリンクの色は実際には2色の間でしか変更できず、一部の記事で述べられているように複数色の間で変更することはできませんが、それを使用しているため、任意の 2 色を選択できるため、色の選択の範囲は比較的広いはずです。

******************************************* **** ******************

********************** ******** ******************************

38. グラフィックを入れますDreamweaver の中央

クリックしてグラフィックを選択します。グラフィックのプロパティ パネルの右上隅に [位置合わせ] の横にドロップダウン ボックスがあります。ドロップダウン ボックスで選択すると、テキストが折り返されます。画像の周り。単一の画像が中央にある場合は、画像パネルの中央プロパティをクリックするだけです。

******************************************* **** ******************

********************** ******** *******************************

39.どこにもリンクせずに動作する

ハイパーリンクとして使用する要素 (画像またはテキスト) を選択し、プロパティ パネルのアドレス バー (リンク) にリンク アドレスを入力しないでください。 「#」記号を追加するだけです (引用符は含めません)。こうすることで、どこにもリンクせずに Behaviors 機能を使用できます。

******************************************* **** ******************

********************** ******** ****************************

40. 1 枚の写真に複数の写真を作成します (拡大) 画像 別のリンク

Dreamweaver では、これは「イメージ ホット ゾーン」と呼ばれる設定を使用して行われます。まず画像を選択すると、画像のプロパティパネルに「地図」ツールバーがあり、その下に「長方形」「円」「多角形」の3つの水色のツールアイコンがあり、必要に応じて選択できます。 (マウスでクリックするだけです)、画像上でマウスを移動し、マウスの左ボタンを押して、マウスをドラッグして水色の領域を描画します (この水色の領域が画像を破壊することを心配しないでください。ブラウザに表示されない場合）、リンク先の Web ページのアドレスをプロパティ パネルに追加するだけです。必要な数のリンクに必要な数の領域を描画します。

******************************************* **** ******************

********************** ******** ******************************

41. ディレクトリツリーを作成する

一般ディレクトリの前に「 」があります。この「 」をクリックすると、そのサブディレクトリが表示されます。「 」が「-」に変わります。リソース マネージャーと同様に、「-」をクリックするとサブディレクトリが非表示になります。これは、一般ディレクトリを記述するページとサブディレクトリを記述するページの 2 つのページを作成する必要があります。一般ディレクトリページの「 」記号をハイパーリンクとして設定し、「リンク」欄にサブディレクトリページのアドレスを追加します。サブディレクトリページの「-」記号をハイパーリンクとして設定し、「リンク」欄に一般ディレクトリページのアドレスを追加します。特定の効果については、Dreamweaver のヘルプ ドキュメントを参照してください。このヘルプ ドキュメントでは、メイン ディレクトリをクリックしてサブディレクトリをポップアップ表示します。メイン ディレクトリに戻るには、サブディレクトリ上のメイン ディレクトリを押しますが、「」では表されません。 " または "-" 。ドキュメントのソースコードを見れば一目瞭然です。

******************************************* **** ******************

********************** ******** ******************************

42. 行間を簡単に設定Dreamweaver では

Cascading Style Sheet (CSS) を使用する機能が実装されています。Dreamweaver で Cascading Style Sheet を編集するためのコードを記述する必要はありません。具体的な操作方法は次のとおりです。クイック起動バーの [カスケード スタイル シート] ボタンをクリックし (つまり、「CSS スタイルの表示」と表示されるボタンの上にマウスを置きます)、ポップアップ CSS スタイル パネルで (なし) をダブルクリックします。

(2) この時点で、ポップアップの [スタイル シートの編集] パネルが表示されるので、パネルの [新規] ボタンをクリックします;

(3) ポップアップの [新しいスタイル] パネルで [HTML タグの再定義] をクリックし、タグで「body」タグを選択してOKボタンを押します;

(4) このとき、「ボディのスタイル定義」ダイアログボックスがポップアップ表示されます。 「body」タグの属性です。任意に設定できますが、ここでは主に行間を設定します。行間なので、線属性入力ボックスに行間のピクセル数を入力します。今人気の9点フォントの場合、行間は通常 12 です。OK ボタンを押してスタイルシート編集パネルに戻ります。この時点で「本文」の行間が設定されています。 「body」で定義された間隔はテーブルでは機能しないため、[スタイルシートの編集] パネルでもう一度 [新規] ボタンを押します。

(6) ポップアップの「新しいスタイル」パネルで「HTML タグの再定義」をクリックし、「タグ」で「td」タグを選択して「OK」ボタンを押します;

(7) ポップアップで「HTML タグを設定」します。 「td のスタイル定義」ダイアログボックスで td の行間を設定し、「OK」ボタンを押して「スタイルシート編集」パネルに戻ります;

(8) 「スタイルシート編集」パネルでもう一度「ドン」ボタンを押します。 Dreamweaver のソースコード表示ウィンドウに、次のコードが表示されます。問題がなければ、設定を変更できます。

43. 閲覧時にWebページのフォントサイズ設定が機能しないようにする方法

CSSカスケードスタイルシートを使用して強制的にフォント(ピクセル)を制御します。

******************************************* **** ******************

********************** ******** ****************************

44. リフレッシュ効果を得るWeb ページを 5 分ごとに表示

Dreamweaver 関数パネルで「head」関数グループ パネルを選択し、このパネルの「更新」関数アイコンをクリックして、ポップアップの「更新の挿入」ダイアログ ボックスに次のように入力します。 「遅延」で更新する間隔。秒単位で測定します。たとえば、5 分ごとに更新するには、300 と入力します。次に、ダイアログ ボックスで [このドキュメントを更新] (現在のウィンドウを更新) を選択し、[OK] を押すと完了です。ページを再度参照すると、5 分ごとに自動的に更新されます。

******************************************* **** ******************

********************** ******** ****************************

45. IE 使用の問題を解決する通常のリンク先Webページをプレビューしたいのに、Webサイトにアップロードすると表示されない現象が発生する

Webページ上のファイル名をすべて小文字(または大文字)に統一してアップロードしてください。多くのサーバーでは大文字と小文字が非常に区別される UNIX オペレーティング システムが使用されているため、大文字のファイル名と小文字のファイル名は 2 つのファイルとみなされます。アップロードするときは大文字と小文字に注意する必要があります。また、ハイパーリンクには絶対パスではなく相対パスを使用する必要があり、中国語のファイル名は使用しないでください。

******************************************* **** ******************

********************** ******** ******************************

46. 以下のハイパーリンクを作成します。新しいウィンドウを開き、Web ページを開きます (つまり、元の Web ページは上書きされません)

Dreamweaver で、リンクのプロパティ パネルで「ターゲット (target)」を「_blank」に設定します。

******************************************* **** ******************

********************** ******** ****************************

47. 不要なタグを非表示にする

ユーザーが次の場合 非表示の要素が Web ページに挿入されると、Dreamweaver は、ユーザーが非表示の要素を選択しやすくするために、対応する要素タグをページに自動的に追加します。しかし、これは必ずしも良いことではありません。たとえば、多数のレイヤーを含むページの最初の行に表を挿入すると、レイヤー要素が多すぎるため、表が自動的にページの最初の行に後退してしまうことがわかります。 1行目はタグが並んでいますが、2行目はブラウジングには影響ありませんが、作業にはかなり支障をきたします。したがって、要素タグが煩わしいと感じた場合は、単純にブロックしてください。その方法は、Ctrl U を押して環境設定パネルを開き、カテゴリで非表示要素を選択すると、すべての要素ラベルがパネルの右側に表示されます。嫌いな要素のタグからチェック マークを外すだけで、今後その要素が表示されなくなることが保証されます。

******************************************* **** ******************

********************** ******** ******************************

48. の問題を解くテーブルが左上隅に張り付いている

この問題にはいくつかの解決策があります。

(1) Ctrl J を押してページのプロパティを表示し、左、上、余白の幅、および余白の高さをすべて 0 に設定します。

(2) 次のコードをコードに追加します: topmargin="0" leftmargin="0"。この方法は IE にのみ適用されます。

(3) 次のコードを追加します。この方法は Netscape に適しています。

プログラミング関連の知識の詳細については、

プログラミング教育

を参照してください。 ！

以上がDW 中国スーパーリーグのための 48 の実践的なヒント (共有)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。