lHTML スタイル その他 '98. 4. 7

l.お知らせ 内容 LINK FILE   HTML Win PC Unix MS-DOS C C++ Mfc Java 
.全般_ .スタイル .名前. _一覧_
 備考  スタイル  文字 ( 配置 )  縁取り枠  領域  浮動域  座標  シート    
リスト   桁下げ表示   ファイル挿入   コメント   表示/非表示   オ-バ-フロー処理   画像処理   カーソル   背景のスクロール
[ページ内] bih-h_sn.htm

T リスト 項目の 番号 や アイコン などを指定します。
番号付リストにアイコンを指定するなど、リストの種類と違う指定をしたとき。
IE スタイルでの指定が優先されます。
NS リストの種類が優先されます。( スタイルによる指定は無視されます。)
  1. <LI STYLE="LIST-STYLE-TYPE:DECIMAL">    1, 2, 3, ・・・
  2. <LI STYLE="LIST-STYLE-TYPE:LOWER-ROMAN"> i, ii, iii, ・・・
  3. <LI STYLE="LIST-STYLE-TYPE:UPER-ROMAN"> I, II, III, ・・・
  4. <LI STYLE="LIST-STYLE-TYPE:ALPHA">     a, b, c, ・・・
  5. <LI STYLE="LIST-STYLE-TYPE:UPER-ALPHA"> A, B, C, ・・・
  <LI STYLE="LIST-STYLE-TYPE:NONE">  IExplore
9. <LI STYLE="LIST-STYLE-TYPE:NONE">  Netscape



T 桁下げ表示 ( Netscape のみ。)

<SPAN STYLE="DISPLAY:LIST-ITEM;">
    リスト( <UL> <OL>など )と同じように、左余白を取って表示します。
    前後には空行が挿入されます。
    IExplore では、<OL>〜</OL>で擬似表現されています。
</SPAN>

 
T 別ファイルの挿入・クリッピング領域 ( Netscape のみ。)

レイヤと同じように、ページの中に 別なファイルを表示します。
[クリッピング領域]は、[ファイルの挿入]に対してのみ使用できます。( と思います。)

<IFRAME WIDTH=0 HEIGHT=0>   <!--IExplore には表示されません。-->
<DIV STYLE="INCLUDE-SOURCE:URL(../frame/bih-h_g1.htm);
   CLIP:RECT(0PX 500PX 95PX 0PX);">
</DIV>
<TABLE HEIGHT=50 BORDER><TR><TD> </TD></TR></TABLE>
</IFRAME>




T コメント ( IExplore のみ。)

<SPAN STYLE="DISPLAY:NONE;">
ここの内容は、IExplore には表示されません。
</SPAN>
Netscape には表示されます。


 
T 表示/非表示 ( IExplore のみ。)

<SPAN STYLE="BACKGROUND:F0F0F0; VISIBILITY:VISIBLE;">AAA</SPAN>
<SPAN STYLE="BACKGROUND:F0F0F0; VISIBILITY:HIDDEN;">BBB</SPAN>
<SPAN STYLE="BACKGROUND:F0F0F0; VISIBILITY:VISIBLE;">CCC</SPAN>
AAA BBB CCC  ← Netscape では、BBB も表示されています。

 
T オ-バ-フロー処理 ( IExplore のみ。)

指定した領域よりも内容の方が大きいときに、はみ出す分の処理方法を指定します。
無指定  縦幅が拡大されます。
OVERFLOW:HIDDEN;  指定領域に納まらない分は表示しません。
OVERFLOW:AUTO;  必要に応じて、スクロールバーが設けられます。
OVERFLOW:SCROLL;  必要がなくても、最初からスクロールバーを設けます。

<DIV ID=S3 STYLE="WIDTH:550PX; HEIGHT:40PX; BACKGROUND:WHITE;">
まったく同じ粘土でも、人間は美しいと感じたり醜いと感じることができます。
</DIV>

<DIV ID=S3 STYLE="WIDTH:550PX; HEIGHT:40PX; BACKGROUND:WHITE; OVERFLOW:HIDDEN;">
まったく同じ紙と絵の具でも、人間はかわいいと感じたり恐ろしいと感じることができます。
</DIV>

<DIV ID=S3 STYLE="WIDTH:550PX; HEIGHT:40PX; BACKGROUND:WHITE; OVERFLOW:AUTO;">
人間は光を感じることができ、人間は形を認識することができます。
</DIV>

<DIV ID=S3 STYLE="WIDTH:550PX; HEIGHT:40PX; BACKGROUND:WHITE; OVERFLOW:SCROLL;">
人間は特定の形をある感情と結び付けることができます。
このような能力に優れる人々は芸術家と呼ばれます。
形には、物体や文章や音の並びなどがあります。
</DIV>

 
T フィルター ( IExplore のみ。)
文字・画像・枠・背景・区切り線 などを、加工して表示します。
WIDTH で、1PX 以上の領域幅を指定する必要があります。

FILTER:ALPHA(OPACITY=10);  濃度 10% で描きます。
FILTER:WAVE(FREQ=3);  細かさ3の横線で描きます。( 0〜±12 )
 横線の色=指定された文字の色。横線部分以外は黒。
 細かさの基準は、LINE-HEIGHT で指定した行間( 一行の高さ )です。
FILTER:WAVE(STRENGTH=10);  揺らぎをかけます。
 上記 FREQ の値を負で指定すると、揺らぎの左右が逆になります。
 揺らぎの分 左右の幅が広がります。( この例では、左右に 10 PX ずつ。)
 表示幅を確保するために、PADDING-LEFT/LIGHT で余白を作ります。
 ただし画像の場合は、揺らぎ分も含めた幅が、WIDTH の範囲で描かれます。
FILTER:ALPHA(OPACITY=10) WAVE(FREQ=3, STRENGTH=2); 組合せ例

表示面積が大きいと、CPU の負担が大きくて表示速度が低下します。
そのため、具体例は別ページに表示します。→ 具体例
ここには 一例だけ表示します。
フィルタ-
<SPAN STYLE="BACKGROUND:D00000;">
<SPAN STYLE="COLOR:YELLOW; FONT-SIZE:50PX; LINE-HEIGHT:50PX;
 WIDTH:200PX; HEIGHT:50PX; PADDING-LEFT:2PX; PADDING-RIGHT:2PX;
 FILTER:WAVE(FREQ=12,STRENGTH=2);">
フィルタ-</SPAN>
</SPAN>
背景をフィルタと一緒に指定すると、背景にもフィルタがかかるので、この例では分けて書いています。

 
T カーソルの変更 ( IExplore のみ。)
CURSOR:AUTO;  カーソルを普通の形で表示します。
AUTO/DEFAULT/TEXT/WAIT/MOVE/HAND/CROSSHAIR/HELP
( 普通/空白部分/文字部分/砂時計形/移動時の形/手の形/十字形/?形 )
AUTO
Aのページ
DEFAULT
Aのページ
TEXT

WAIT

MOVE

HAND

CROSSHAIR

HELP


用例 ( 黄色の ? は、ふたつ共 クリックできます。)

<FONT COLOR=YELLOW>
<B OnClick=alert('ちょっとわかりにくいですね。') >?</B>
</FONT><BR>

<FONT COLOR=YELLOW>
<B OnClick=alert('これなら、\n説明であることが\nすぐわかります。')
   STYLE="CURSOR:HELP;">?</B>
</FONT><BR>


 
T 背景のスクロール禁止 ( IExplore のみ。)
ページの、背景画像だけを固定します。
スクロールすると、背景画像以外の内容だけがスクロールされます。
<BODY STYLE="BACKGROUND-ATTACHMENT:FIXED;">  SCROLL/FIXED
<BODY BGPROPERTIES=FIXED"> と同じですから、用例は省略します。
※ 背景画像も指定すること。


T

  mtoga@sannet.ne.jp   登録日 '96. 6.15
URL : http://www.page.sannet.ne.jp/mtoga/index.html