ビデオ: Muse入門(第5回)ページタイトルを忘れずに!ページプロパティの設定方法 2024
Dreamweaverを使用する多くのデザイナーと同じように、Webページのリンクテキストの下に自動的に表示される下線が気に入らないようです。 Dreamweaverの[ページプロパティ]ダイアログボックスで、そのアンダーラインを削除し、リンクの色、フォント、サイズを変更することは本当に簡単です。 [ページのプロパティ]ダイアログボックスで、背景色やページの余白など、他のページ全体の設定を変更することもできます。
<! - 1 - >すべてのリンクスタイルを一度に変更する最も簡単な方法は、[ページプロパティ]ダイアログボックスでそれらを変更することです。このオプションを使用すると、対応するタグセレクタスタイルが自動的に作成され、CSSスタイルパネルにリストされます。このダイアログボックスの他のページ全体の設定も同様に機能し、CSSツールを使用してこれらのオプションをすべて編集できます。
[ページプロパティ]ダイアログボックスでハイパーリンクやその他のスタイルを変更するには、既存のページを開くか、新しいページを作成して次の手順を実行します。
-
変更→ページプロパティを選択します。
または、プロパティインスペクタでページプロパティボタンをクリックすることもできます。 [ページプロパティ]ダイアログボックスが表示されます。
-
[ページプロパティ]ダイアログボックスの左側で、[リンク(CSS)]カテゴリを選択します。
-
リンクのフォントとサイズを指定します。
<! - 3 - >あなたのページのテキストの残りの部分と同じフォントサイズと顔をリンクに使用する場合は、これらのオプションを空白のままにすることをお勧めします。次に、ページのテキスト設定を変更すると、リンクの変更も忘れずに済みます。
-
対応するカラーウェルをクリックし、[カラー]ダイアログボックスからカラーを選択することによって、各ハイパーリンク状態のカラーを指定します。
リンクの色の設定を変更することができます。リンクカラーを指定しない場合、ブラウザはデフォルトのリンクカラーを使用します。次の4つのリンク状態について説明します:
-
リンクの色: ページが最初に読み込まれ、リンクされたページがまだブラウザにアクセスされていないときにリンクが表示される色。対応するHTMLタグはです。
-
Visited Links: ブラウザが既にリンクページを閲覧した後で、リンクが変わる色です。対応するHTMLタグはです。
-
ロールオーバーリンク: ユーザーがリンク上でカーソルをロールすると、リンクの色が変わります。対応するHTMLタグはです。
-
アクティブリンク: ユーザーがアクティブにリンクをクリックしているときにリンクの色が変わります。対応するHTMLタグはです。
-
-
下線スタイルドロップダウンリストからスタイルを選択します。
デフォルトでは、Webブラウザに表示されるリンクに下線が引かれます。多くのデザイナーは、リンクテキストの下に自動的に表示されるアンダーラインを削除することを好まない場合は、アンダーラインを選択します。訪問者にはアンダーラインの視覚的な手がかりを与えることができますが、リンク上でカーソルを動かすときに限って表示されるので、[ロールオーバーで下線のみ表示]オプションを選択します。
-
OKをクリックします。
[ページプロパティ]ダイアログボックスが閉じ、スタイル設定がページの任意のリンクに自動的に適用され、対応するスタイルが[CSSスタイル]パネルに追加されます。
リンクスタイルを完全にテストするには、Webブラウザでページをプレビューするか、ワークスペースの上部にある[ライブビュー]ボタンをクリックします。前回の練習で変更したときにブラウザのリンク設定をテストすることをお勧めします。あなたのリンクがどのように表示されるかを見てみましょう。
たとえば、アクティブなリンクと訪問したリンクの色が、ページの背景色とよく一致するかどうかを確認します。ページプロパティダイアログボックスを使用して作成するスタイルは、再定義されたタグスタイルを上書きする別のスタイルを個別のリンクに適用しない限り、ページの すべての リンクに影響します。
同じページの異なる部分で異なるリンクスタイルを使用する場合は、複合スタイルを作成してさまざまなリンクスタイルを作成できます。