携帯対応HTML/XHTMLタグその他
font
フォント
2009/11/23
[iモード対応HTML Ver2.0]
[au XHTML]
[SoftBank HTML] [SoftBank XHTML]
font要素は、文字の色や大きさど文字のスタイルを定義するインライン要素です。
属性
docomo
属性 | iモード対応 HTMLバージョン |
iモード対応 XHTMLバージョン |
説明 |
---|---|---|---|
color="%Color" | 2.0 | - | 文字の色を指定。デフォルトは黒。 ※カラー対応機種のみ。 |
size="{1~7}" | 5.0 | - | 文字サイズを数値で指定。 ※FOMA(i-HTML5.0)以降のみ。「1~2」はフォントサイズ小、「3」はフォントサイズ中(デフォルト)、「4~7」はフォントサイズ大。 |
size="+1" size="-1" |
5.0 | - | 文字サイズを相対指定。 ※FOMA(i-HTML5.0)以降のみ。 |
au
属性 | XHTML | 説明 |
---|---|---|
WAP2.0 | ||
color="%Color" | ○ | 文字の色を指定。デフォルトは黒。 |
size="{1~7}" | ○ | 文字サイズを数値で指定。「1~4」はフォントサイズ小。それ以降は徐々にフォントサイズが大きくなる。 |
SoftBank
属性 | HTML | XHTML | 説明 | |||
---|---|---|---|---|---|---|
SoftBank HTML C2型 |
SoftBank HTML C3型 |
SoftBank HTML P型 |
SoftBank HTML 3GC型 |
SoftBank XHTML 3GC型 |
||
color="%Color" | ○ | ○ | ○ | △ | ○ | 文字の色を指定。デフォルトは黒。 |
注意事項
- SoftBank
-
- font要素内にimg/br要素を記述することはできません。
- font要素にid/class/lang/title/style/size/face属性を指定することはできません。
サンプル
<font color="#000000" size="1">size=1</font><br> <font color="#333333" size="2">size=2</font><br> <font color="#363636" size="3">size=3</font><br> <font color="#666666" size="4">size=4</font><br> <font color="#696969" size="5">size=5</font><br> <font color="#999999" size="6">size=6</font><br> <font color="#c9c9c9" size="7">size=7</font><br><br> <font color="#ff6699" size="+1">size+=1</font><br> <font color="#ff6699">size+=0</font><br> <font color="#ff6699" size="-1">size-=1</font><br>

u
テキストに下線を引く
2009/11/23
[au XHTML]
[SoftBank HTML] [SoftBank XHTML]
u要素は、テキストに下線(アンダーライン)を引いて表示するインライン要素です。
<u>
~</u>
で囲んだ部分のテキストに下線が表示されます。
XHTMLでは、spanまたdiv要素に「text-decoration:underline;」をスタイルシートで指定しましょう。
注意事項
- SoftBank
-
- [HTML]u要素内にimg/br要素記述不可。
サンプル
■HTML鐓r緒V鐔緒盾<u>鐓r緒V鐔緒盾</u>鐓r緒V鐔緒盾■XHTML
鐓r緒V鐔緒盾<span style="text-decoration:underline;">鐓r緒V鐔緒盾</span>鐓r緒V鐔緒盾

blink
テキストを点滅させる
2009/11/23
[iモード対応HTML Ver2.0]
[au XHTML]
[SoftBank HTML] [SoftBank XHTML]
blink要素は、タグで囲まれた部分のテキストを点滅表示するインライン要素です。
画像などテキスト以外の文字列は点滅しません。
XHTMLでは、spanまたdiv要素に「text-decoration:blink;」をスタイルシートで指定しましょう。
※PC向けサイトではblink要素はご法度ですが、携帯サイトではテキストを目立たせるのに使用するメジャ―なタグです。
サンプル
■HTML<blink>テキストが点滅します!</blink>

<span style="text-decoration:blink;">テキストが点滅します!</span><br> <div style="text-decoration:blink;">テキストが点滅します!</div>

marquee
テキストを横に流す
2009/11/23
[iモード対応HTML Ver2.0]
[au XHTML]
[SoftBank HTML] [SoftBank XHTML]
marquee要素は、mタグで囲まれた部分をスクロール表示するインライン要素です。
XHTMLでは、spanまたdiv要素に「display:*;」をスタイルシートで指定します。
※PC向けサイトではmarquee要素は過去の産物ですが、携帯サイトでは長いテキストを1行でスクロールさせることができるため、テキストをRSSリーダー風に流して目立たせるのに使用するメジャ―なタグです。
属性
docomo
属性 | iモード対応 HTMLバージョン |
iモード対応 XHTMLバージョン |
説明 |
---|---|---|---|
behavior="%Behavior" | 2.0 | - | スクロール画面終端での振る舞いを指定。デフォルトは「scroll」。 |
direction="%Direction" | 2.0 | - | スクロール方向を指定。デフォルトは「left」。 |
loop="{1~16}" | 2.0 | - | スクロールを繰り返す回数を指定。デフォルトは無限ループ(16回)。 |
width= | 2.0 | - | 画面幅固定。-※ユーザー変更不可。 |
height= | 2.0 | - | 1行固定-※ユーザー変更不可。 |
scrollamount= | 2.0 | - | 高さをピクセル単位で指定。 |
scrolldelay= | 2.0 | - | 高さをピクセル単位で指定。 |
bgcolor="%Color" | 5.0 | - | 背景色を指定。 |
style="display: -wap-marquee; |
- | 1.0 | テキストをスクロール。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-style:scroll; |
- | 1.0 | 一方方向へのスクロールを繰り返す(デフォルトと同じ) 。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-style:slide; |
- | 1.0 | スクロールを1回したら停止。。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-style:alternate; |
- | 1.0 | スクロール方向(左→右、右→左)を交互にスクロール。。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-dir:rtl; |
- | 1.0 | 左→右へスクロール。。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-dir:ltr; |
- | 1.0 | 右→左へスクロール。。 ※span要素またはdiv要素のみ指定可能。 |
style="display: -wap-marquee-loop:{1~16}; |
- | 1.0 | ループ回数を指定。デフォルトは無限ループ(16回)。 ※span要素またはdiv要素のみ指定可能。 |
au
属性 | XHTML | 説明 |
---|---|---|
WAP2.0 | ||
direction="%Direction" | ○ | スクロール方向を指定。デフォルトは「left」。 |
behavior="%Behavior" | ○ | スクロール画面終端での振る舞いを指定。デフォルトは「scroll」。 |
scrolldelay="%Number" | ○ | スクロール移動間隔をミリ秒で指定。0より大きい値を指定。 |
scrollamount="%Number" | ○ | 一度にスクロールする幅をピクセル単位で指定。0より大きい値を指定。 |
loop="{%Number|inifinite}" | ○ | スクロールを繰り返す回数を指定。デフォルトは0で無限ループ(inifiniteと等価)。 |
bgcolor="%Color" | ○ | 背景色を指定(デフォルトは白)。 |
SoftBank
属性 | HTML | XHTML | 説明 | ||||
---|---|---|---|---|---|---|---|
SoftBank HTML C2型 |
SoftBank HTML C3型 |
SoftBank HTML P型 |
SoftBank HTML 3GC型 |
SoftBank XHTML 3GC1型 |
SoftBank XHTML 3GC2型 |
||
direction="%Direction" | ○ | ○ | ○ | ○ | ○ | ○ | スクロール方向を指定。デフォルトは「left」。 |
behavior="%Behavior" | × | × | ○ | ○ | ○ | ○ | スクロール画面終端での振る舞いを指定。デフォルトは「scroll」。 |
scrolldelay="%Number" | × | × | ○ | △ | △ | △ | スクロール移動間隔をミリ秒で指定。0より大きい値を指定。 |
scrollamount="%Number" | × | × | ○ | △ | △ | △ | 一度にスクロールする幅をピクセル単位で指定。0より大きい値を指定。 |
loop="{%Number|inifinite}" | × | × | ○ | ○ | ○ | ○ | スクロールを繰り返す回数を指定。デフォルトは0で無限ループ(inifiniteと等価)。 |
bgcolor="%Color" | × | × | △*1 | △ | △ | △ | 背景色を指定(デフォルトは白)。 |
*1:P4(2)型端末でのみ
サンプル
HTML
<marquee behavior="scroll">テキストがスクロールします!</marquee> <marquee behavior="slide">テキストがスクロールします!</marquee> <marquee behavior="altemate">テキストがスクロールします!</marquee> <marquee direction="left">テキストが右から左へスクロールします!</marquee> <marquee direction="right">テキストが左から右へスクロールします!</marquee> <marquee loop="2">テキストが2回スクロールします!</marquee> <marquee bgcolor="yellow">テキストがスクロールします!</marquee>

XHTML
[iモード対応HTML Ver1.0]▼デフォルト <span style="display:-wap-marquee;">テキストがスクロールします!</span> <div style="display:-wap-marquee;">テキストがスクロールします!</div> ▼一方方向へのスクロールを繰り返す(デフォルトと同じ) <span style="display:-wap-marquee;display:-wap-marquee-style:scroll;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-style:scroll;">テキストがスクロールします!</div> ▼スクロールを1回したら停止 <span style="display:-wap-marquee;display:-wap-marquee-style:slide;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-style:slide;">テキストがスクロールします!</div> ▼スクロール方向(左→右、右→左)を交互にスクロール <span style="display:-wap-marquee;display:-wap-marquee-style:alternate;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-style:alternate;">テキストがスクロールします!</div> ▼右→左へスクロール <span style="display:-wap-marquee;display:-wap-marquee-dir:rtl;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-dir:rtl;">テキストがスクロールします!</div> ▼左→右へスクロール <span style="display:-wap-marquee;display:-wap-marquee-dir:ltr;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-dir:ltr;">テキストがスクロールします!</div> ▼ループ回数指定(デフォルトは「1」、無限ループの場合は「infinite」) <span style="display:-wap-marquee;display:-wap-marquee-loop:2;">テキストがスクロールします!</span> <div style="display:-wap-marquee;display:-wap-marquee-loop:2;">テキストがスクロールします!</div>

center
要素の中央寄せ
2009/11/23
[iモード対応HTML Ver1.0]
[au XHTML]
[SoftBank HTML] [SoftBank XHTML]
center要素は、要素をセンタリング(左右中央揃え)して表示するブロック要素です。 <center>~</center>内の要素は、ブロック要素もインライン要素もすべてセンタリングされて表示されます。
ただし、直接style="text-align:left;"
のように左寄せなどを指定している要素は、center要素より要素に直接指定したstyle属性の定義が優先されますので、center要素内にあってもセンタリングはされません。
注意事項
- SoftBank
-
- center要素内に、ul/ol/pre/dl/div/center要素を記述することはできません。
- div要素のalign属性にcenterを指定した場合と等価。
サンプル
テキストテキストテキストテキストテキストテキストテキスト<br><br> <center> <img src="dog.gif" width="76" height="76" alt="dog"><br> テキストも画像もセンタリング </center><br> テキストテキストテキストテキストテキストテキストテキスト
