文字の修飾・装飾編

文字の修飾・装飾編

２００２年５月２５日情報公開！


文字を違うように見せたい！
そんな風に思うようになると思います！
そこで他のサイトから集めてきた情報を
このページで公開したいと思います！

まず基本から！
普通の文字の状態
（標準）
太字→ 太字
斜体文字→ 文字
下線→ 文字
取消線→ 文字
上付き文字→文字
下付き文字→文字
タグ表記例：<b>文字</b>
タグ表記例：<i>文字</i>
タグ表記例：<u>文字</u>
タグ表記例：<s>文字</s>
タグ表記例：<sup>文字</sup>
タグ表記例：<sub>文字</sub>
上記の装飾・修飾はこのページを拝見する方のパソコンに
よって異なった表示が表示されます。

文字の書体変更
標準の書体
HG丸ｺﾞｼｯｸ体→
あいうえお
HGｺﾞｼｯｸE-PRO→
あいうえお
HG正楷書体-PRO→
あいうえお
DFPOP体→
あいうえお
DFPPOP体→
あいうえお
DFP特太ｺﾞｼｯｸ体→
あいうえお
DF特太ｺﾞｼｯｸ体→
あいうえお
MSPｺﾞｼｯｸ→
あいうえお
MSｺﾞｼｯｸ→
あいうえお
MSP明朝→
あいうえお
MS明朝→
あいうえお
タグ表記例：
<font face=HG丸ｺﾞｼｯｸ体>あいうえお</font>
タグ表記例：
<font face=HGｺﾞｼｯｸE-PRO>あいうえお</font>
タグ表記例：
<font face=HG正楷書体-PRO>あいうえお</font>
タグ表記例：
<font face=DFPOP体>あいうえお</font>
タグ表記例：
<font face=DFPPOP体>あいうえお</font>
タグ表記例：
<font face=DFP特太ｺﾞｼｯｸ体>あいうえお</font>
タグ表記例：
<font face=DF特太ｺﾞｼｯｸ体>あいうえお</font>
タグ表記例：
<font face=MSPｺﾞｼｯｸ>あいうえお</font>
タグ表記例：
<font face=MSｺﾞｼｯｸ>あいうえお</font>
タグ表記例：
<font face=MSP明朝>あいうえお</font>
タグ表記例：
<font face=MS明朝>あいうえお</font>
上記の書体変更はこのページを拝見する方のパソコンに
内蔵されている場合のみ正しく表示されます。
内蔵されていても表示されない場合もあります

文字の装飾・修飾
ここの文字装飾の下記のタグのそのままの引用（活用）は極力避けてください。
もし、使うのであれば色名を替えての使用にして下さい。
どうしてもこの例の色の通りでの使用をしたい場合はサイトの掲示板にて
『装飾文字の例にあるタグをそのまま使わせてください』と
一言カキコすれば使用許可を認めます。
もし何も書かずにそのまま使って僕が見つけた場合は
上記の使用許可文を書いてもらいます。

★文字に影をつける★
ぷよよーん！！
→タグ表記例：
<font style="filter:shadow(color:gray;direction:140);height:20;width:100%;font-size:40;color:green";>ぷよよーん！！</font>

★文字に影をつける：もう一つの方法★
ぷよよーん！
→タグ表記例：
<font style="filter:dropshadow(color:red);height:30;width:100%;font-size:40;color:green";>ぷよよーん！！</font>

★文字にぼかし効果をつける★
ぷよよーん！！
→タグ表記例：
<font style="filter:blur(strength:20);width:100%;font-size:40;color:blue";>ぷよよーん！！</font>

★発光したような効果をつける★
ぷよよーん！！
→タグ表記例：
<font style="filter:glow(color:red;strength:20);height:10;width:100%;color:pink;font-size:40;">ぷよよーん！！</font>

★上記の２つのタグで応用★（文字をfont size=7より大きくする）
上記の２つのタグ表記例の中にfont-size:40という文字があります。
その数値を変えると大きくなります！
まずは<font size=7>の文字の大きさ</font>
ぷよ！
では早速、大きさを変えての表示です！↓（70にした場合）
ぷよ！

次は倍の140にした場合↓
ぷよ！

★何にもつけない効果での大きさ変更は…（50の場合）★
ぷよ！
→タグ表記例：
<font style="width:100%;font-size:50;color:green";>ぷよ！</font>


～５月２６日情報を２つ追加！～

★あんまり意味ないけど文字を逆立ちさせる効果★
逆立ちさせたい文字
→タグ表記例：
<font style="width:100%;font-size:30pt;filter:flipV()">逆立ちさせたい文字</font>

★これは少し役に立つかも…、文字を透かす効果（透明にする）★
透かさせたい文字
→タグ表記例：
<font style="width:100%;font-size=30pt;z-index:2;filter:mask(color=mediumblue)">透かさせたい文字</font>


～６月５日情報を２つ追加！～

★あんまり意味ないけど文字を裏返しさせる効果★
裏返しさせたい文字
→タグ表記例：
<font style="width:100%;font-size:25;color:red; filter:Fliph(enabled=true)">裏返しさせたい文字</font>
※上記の裏返しのタグは文字と後ろの空白自体を
逆さにするので上記の場合（100%）の時は右端になり、
0%にすると左端に文字が表示されるようになります。


★俳句などを表示する時に役立ちそうな文字を縦書きにさせる効果★
縦書きにさせたい文字
→タグ表記例：
<font style="writing-mode:tb-rl">縦書きにさせたい文字</font>

※上記の縦書きにさせるのタグは次の行にうつすには
改行をいれてください。（<br>）

縦書きにさせる文字数が少ないと右から読むように文字の順番が逆になります。
２文字の場合
文章
３文字の場合まで右読みになり４文字の場合から縦書きになるようです

今の所はこれだけかな、そのうちまた追加するかもしれないよ。
最終更新2003/1/13

© Rakuten Group, Inc.
X
Mobilize your Site
スマートフォン版を閲覧 | PC版を閲覧
    Share by: