鏡文字とか逆さ文字とか…

もう何年も前からあったようですが、実は数カ月前に初めてこんなのに気がつきました。

何かのIDでアルファベットがこんな風に【ıuɐɯɐɯnʞnɯouıʞ】…と、逆さまになっているのを見て「おもしろーい♪」と思ったのです(#^.^#)

これは画像でもなく、アルファベットそれぞれをひっくり返しているのでもなく、ひっくり返したアルファベットに見える特殊文字などを反対から並べているんですね。

「Flip Title」というサイトで、アルファベットを入力すると逆さ文字で表示してくれて、それをコピペしたら簡単に使えることもわかりました♪

それで作るとこんな感じ↓
/ɯoɔ˙ᄅɔɟ˙Ɛ0⇂ɓolq˙uǝɹxɐɹnʞɐs//:dʇʇɥ

でも、日本語はダメなんです。
当然っちゃ、当然ですね。
ひらがな・カタカナ・漢字を逆さにしたような「文字」がありませんから。

日本語でも使ってみたいわ( *´艸`
…ということで、日本語対応(?)の方法を調べました。
(CSSで設定するため、自分のブログやサイトでなければ使えません。)


これが鏡文字になります。
abcde ABCDE
http://sakuraxren.blog103.fc2.com/


http://sakuraxren.blog103.fc2.com/
abcde ABCDE
これが逆さ文字になります。

斜め文字もできます。
abcde ABCDE
http://sakuraxren.blog103.fc2.com/





ブログなどで使うにはCSSに


.matrix1 {
-moz-transform:matrix(-1, 0, 0, 1, 0, 0);
-webkit-transform:matrix(-1, 0, 0, 1, 0, 0);
-o-transform:matrix(-1, 0, 0, 1, 0, 0);
-ms-transform:matrix(-1, 0, 0, 1, 0, 0);
transform:matrix(-1, 0, 0, 1, 0, 0);
}


.matrix2 {
-moz-transform:matrix(-1, 0, 0, -1, 0, 0);
-webkit-transform:matrix(-1, 0, 0, -1, 0, 0);
-o-transform:matrix(-1, 0, 0, -1, 0, 0);
-ms-transform:matrix(-1, 0, 0, -1, 0, 0);
transform:matrix(-1, 0, 0, -1, 0, 0);
}


.matrix3 {
-webkit-transform: matrix(0.940,-0.188,0.181,0.904,0,0);
-moz-transform: matrix(0.940,-0.188,0.181,0.904,0px,0px);
-ms-transform: matrix(0.940,-0.188,0.181,0.904,0,0);
-o-transform: matrix(0.940,-0.188,0.181,0.904,0,0);
transform: matrix(0.940,-0.188,0.181,0.904,0,0);
}

など、回転角度(傾き)などを任意の数値を書き込んだものをそれぞれ「.matrix◯」としてを記述。

使う場合は

<p class="matrix2">これが逆さ文字になります.
abcde ABCDE
http://sakuraxren.blog103.fc2.com/</p>


↓ここで角度など決めると数値が出てきます。
Playing with matrices

画像をこんな風に表示することもできます。

2015040411.jpg



……が……!
逆さ文字など…実用性に欠けますので、使用する場面がほとんど思いつきません…!


ま、おもしろいのでとりあえず備忘録として記事にしておきます( *´艸`)



関連記事

2 Comments

kids  

はじめまして。

とても面白いとおもいます。

最後の写真は角度変えて並べると回りますね。

なにか使い方ありそうですね。

とはいっても私には難しそうですが...
ありがとうございました。

2015/07/11 (Sat) 20:03 | REPLY |   

れん  

kids様

kids様、いらっしゃいませm(__)m

ちょっとおもしろいな!と思い記事にしてみましたが、どんな時に使ったらいいのか思いつきません( *´艸`)

写真も…斜めにすると見にくいですよね(^^ゞ
目立たせるためにはいいかもしれませんが。

なにかおもしろい使い方を思いつきましたら、ぜひとも教えて下さいね!

コメントありがとうございました(#^.^#)

2015/07/12 (Sun) 00:22 | EDIT | REPLY |   

Post a comment