文字列を円形にみせるタグ

♪^ま た
ね _て 来

６文字を使って「ま」を少し上の位置にして

文字サイズを他の文字より大きめする。

そして「て」を少し下の位置にして

２列目を逆向きに文字を並べたものです。

<FONT size="4" color="#ff0000">♪<SUP><FONT color="#f2ce00" size="5">ま</FONT></SUP></FONT> <FONT color="#379bff" size="4">た</FONT>
<FONT color="#00d500" size="4">ね</FONT>_{<FONT color="#ff00ff" size="4">て</FONT>} <FONT color="#ff0000" size="4">来</FONT>

上付き文字を<SUP>タグを使って

下付き文字に<SUB>使えば

円形に並んでるようにみえる。

<SUP>と<SUB>を上手く使えば

波のような文字列を表現することも可能です。

あ ^り が _と う ^～ ☆


タグお持ち帰り

文字カラー＆フォント見本

DEAR MY FRIEND♪

一文字一文字色番号を指定すれば

↑上のような文字も出来ますよ♪

種類は、少ないですが…

書体と文字色見本を作ってみました。

パソコンにその書体がインストールされていない場合は、

うまく表示されません。m(_ _)m

↑上の文字は…

フォント'HG丸ｺﾞｼｯｸM-PRO'

色番号="#646E5A"

リンクさせると文字色が変わりますが…

リンク文字としても使用できます。

☆フォント＆色見本☆

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'Comic Sans MS' 色番号"#663366"

リンクさせたので少し色が違いますが…

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'Lucida Console' 色番号"#508219"

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'Georgia' 色番号"#A58205"

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'ＭＳ Ｐ明朝' 色番号="#9B002D"

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'arial black' 色番号="#231E64"

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'Eraa Demi ITC' 色番号"#05466E"

DEAR MY FRIEND♪
0123456789

↑上の文字は…

文字サイズは、全て同じです。

フォント'Trebuchet MS' 色番号="#326E41"


タグお持ち帰り

んー微妙なCSS編集でブログタイトルがちょっと丸くなったかな？…

/*■■■デザインカスタマイズ - ヘッダー*/

/*■ブログタイトル*/
#header h1{
font-weight:light;font-family:italic;
line-height:1.2;
}

イタリックは、斜体になるけれど

DEAR MY FRIEND♪

赤文字部分を'Comic Sans MS'に変更してみた。

DEAR MY FRIEND♪

'Comic Sans MS' は、丸っこい文字になる。

下のお持ち帰り用タグは、ブログ本文で使用するタグです。

書体、サイズ、文字色などを自分で変更して使ってくださいね。

タグお持ち帰り

↓下の書体は、ノーマルです。

DEAR MY FRIEND♪

違いが判るでしょうか？


ブログを書くときは、斜体ボタンを使えば<em></em>のタグが使えるので簡単だけれど…

ブログタイトルには、使えない。

ブログタイトルの書体を変更する場合は、

CSS編集から出来ます。

赤文字部分を好きな書体に変更してください。

書体サンプルは、こちらのサイトで調べる事が出来ますよ(*^▽^*)