■ ≪戻る ★ホームページ作成ソフト・ホームページビルダーを中心にした解説/ホームページの作成支援サイト★ ■ ホームへ≫



  ■ スタイルの設定ダイアログの解説-スタイルの設定対象

  ここではスタイルの設定ダイアログ上部にあるスタイルの設定対象に関する項目について解説します。

  まず、スタイルの設定ダイアログを開きます。

  スタイルの設定ダイアログ左上部にスタイルの設定対象を選択する項目があります。
 (どの対象についてスタイルを設定するかによって下図の四角で囲っている部分の表示が変わります。)


スタイルの設定対象は3つあります。これから設定対象別に解説していきます。



◆ HTMLタグのスタイルを設定 ◆


HTMLタグのスタイルを設定とは?

あらゆるHTMLタグ(本文<BODY>、段落<P>、見出し<H1>〜<H6>等々)にスタイルを設定できます。設定すると
ページ内にある設定されたタグの見た目をすべて変えることができます。
たとえば見出し<H1>の色を赤に設定すると、ページ内のすべての見出し<H1>は赤で表示されるようになり、
段落<P>のフォントサイズを13ポイントに設定すると、ページ内のすべての段落<P>は13ポイントのフォント
サイズで表示されるようになります。


HTMLタグのスタイルを設定ダイアログの解説

下図は@のスタイルの設定対象の中からHTMLタグのスタイルを設定を選択した時のダイアログです。



AのHTML タグ名には、BのHTML タグの候補から選んだタグ名が表示されます。
また、編集画面で編集中にスタイルの設定ダイアログを呼び出した場合、編集画面で現在選択されている
タグ名が表示されます。

BのHTML タグの候補には、スタイルを設定できるタグの一覧が表示されます。


                                     ▲ページTOPへ




◆ クラスのスタイルを設定 ◆


クラスのスタイルを設定とは?

これはタグとは無関係にスタイルを設定する方法です。設定したスタイルにクラス名を付けておき、
そのスタイルを適用したいタグにそのクラスを関連付けます。クラスを使えば、異なるタグに同じ
スタイルを適用できます。

ある独自の名前に対してスタイルを設定します。ページ内のタグに、その名前をクラス属性として設定
することで、そのタグの見た目を変えることができます。この場合は、ページ内でその名前をクラス属性と
して使用しているすべての個所のスタイルが変更されます。


クラスのスタイルを設定ダイアログの解説

下図は@のスタイルの設定対象の中からクラスのスタイルを設定を選択した時のダイアログです。



Aのクラス名には、Bの定義済みのクラス名リストを参考にして、まだ使用されていない名前を
クラスの名前として入力してください。入力された名前をクラス名として区別する為に、名前の前に
「.」が付けられます。

Bの定義済みのクラス名には、以前に設定済みのクラス名が一覧で表示されます。

クラスを指定する場合、半角英数字を使用してください。また「! " # % & . _ 」などの特殊記号を
使用した場合、認識されない可能性があるので注意が必要です。


                                     ▲ページTOPへ




◆ IDのスタイルを設定 ◆


IDのスタイルを設定とは?

これもタグとは無関係にスタイルを設定する方法です。設定したスタイルにIDを付けておき、そのスタイルを
適用したいタグにそのIDを関連付けます。ただし、1つのIDはページ内で1個所しか関連付けられません。
通常は、IDを使わずにクラスを使うことをお勧めします。

ページ内の id 属性に、スタイルを設定します。id 属性はページ内に同じものが2つとないので、
この id 属性に対するスタイルはページ内で一個所にしか適用されません。


IDのスタイルを設定ダイアログの解説

下図は@のスタイルの設定対象の中からIDのスタイルを設定を選択した時のダイアログです。



AのID 名欄に、ID 名を入力してください。入力された名前にはIDとして区別する為に、名前の前に
「#」が付けられます。

※IDを指定する場合、半角英数字を使用してください。また「! " # % & . _ 」などの特殊記号を
使用した場合、認識されない可能性があるので注意が必要です。


  スタイルの設定対象に関する解説は以上です。

                                         ▲ページTOPへ

  ■ ≪戻る



さぬきWEBは個人・お店用ホームページ制作代行を行っているSOHOです  さぬきWEBは個人・お店用ホームページ
 制作・作成代行を行っているSOHOです
 さぬきWEBへ≫
ホームページ作成ソフト・ホームページビルダーを中心にした解説/ホームページの作成支援サイト/ホームページを築城せよ!!  ホームページ作成ソフト・ホームページ
 ビルダーを中心にした解説/
 ホームページの作成支援サイト

Copyright(C)2006 ホームページを築城せよ All Rights Reserved