昔、よく「このサイトはNetscape Navigatorでご覧ください」とか「このサイトはInternet Explorer用です」とか書いてあるサイトがあって、非常にむかつきました。客に制約を課すな!と思うんです。
ですがこの記事においでのみなさん、この記事だけは InternetExplorer でご覧ください。
謹賀新年
慎んで新年のお喜びを申し上げます
東京都千代田区永田町一ノ一
やまだ たろう
背景イラスト「 年賀状・干支イラスト桜屋 」: 作者の方のブログ「 イラスト素材ブログ 」
これはイラスト以外はすべてHTMLで書いています。そして、InternetExplorerで見た場合のみ縦書きで表示されます。理由はInterbetExplorer特有の機能を使っているからです。
Webの世界で言えば、この記事は欠陥品です。なぜならばInternetExplorerでしか見ることができない。訪れてくれた人に向かって「InternetExplorerで見ろ!そーでない客お断り」と言っている状態が今見ているページです。そんなものは 完璧な欠陥品 です。
では全く使えないのでしょうか?いいえ使えます。縦書き表示ができるブラウザはInternetExplorerだけです。これは非常に優れた機能です。
HTMLやブラウザを使うのは、必ずしもインターネットだけではありません。これは個人的なことですが、わたし自身はWindows用のソフトウエアを作る時によく、InternetExplorerを埋め込みます。埋め込んでしまえば、firefoxやGoogle Chromeへの対応を考える必要はなく、強力な機能が使いまくりです。
ではプログラミングをしない人にはどんな使い道があるのか?
例えば上のように、HTMLでレイアウトをすれば、画像ソフトなしでも年賀状が作れます。実際上の年賀状はイラストを除いて、すべてHTMLだけで実現しています。
<div style="background:url('URL') bottom right no-repeat;width:10cm;height:14.8cm;padding:0; writing-mode:tb-rl;font-family:'HG正楷書体-PRO' "> <p style="font-size:6em;font-weight:bold;color:#d00;margin:20px 20px 0 0">謹賀新年</p> <p style="font-size:1.6em;font-weight:bold;margin-top:1em">慎んで新年のお喜びを申し上げます</p> <div style="margin:17em 15em 0 0;padding:0"> <p style="font-size:2em;font-weight:bold">東京都千代田区永田町一ノ一</p> <p style="font-size:2em;font-weight:bold;margin-top:6em">やまだ たろう</p> </div> </div>
writing-mode:tb-rl が縦書きを実現するスタイルです。
ライティングモードが tb-rl
t
op to b
ottom かつ r
ight to l
eft
つまり上から下かつ右から左という意味です。
これが指定されたdivタグの中だけが縦書きになっています。
font-family:'HG正楷書体-PRO' が書体(フォント)の指定です。楷書体を指定しています。このフォントがパソコンの中にない場合もあるので、書体は複数指定できます。
その場合はカンマで区切って、 font-family:'書体1','書体2','書体3' というように指定していきます。先に指定したフォントがあれば、それが使われ、なければ次のフォントを試します。全部見つからないと、ブラウザが基準にしているフォントが使われます。
あとはじぶんで調べてください。最近やるきにならない。普通、書いたことが参考にされたり、使われたりすればうれしいんだけど、このぶろぐではガッカリする。俺の常識では使ったら、相手に知らせるものだけど、このブログでは全員が黙って使う。報告しろとは書いてないからまあいいけど、初心者相手はだめだな。常識が違う。