HTML – ページ 4

前回ファンブログのスタイルシートを読み込まずにhtmlファイルを表示したら、思い通りに表示されませんでした。

ソースは同じなのに何故、違う表示がされるのか？
それは、スタイルシートの初期値が違うからです。

InternetExplorerやfirefoxなどのブラウザはそれぞれにスタイルシートの初期値を持っています。
何もスタイルシートを読み込まない場合、その初期値を使います。

前回使ったhtmlファイルは、「縦書きHTML」という記事で使ったソースを流用しました。そのソースはファンブログのスタイルシートを基準に作られています。だから、そのファンブログのスタイルシートを先に読み込まないと基準値が違うために、表示が変わります。

これと同じことは、ブラウザを変えただけで起こります。

しかし、今見ているページはInternetExplorerで見ても、firefoxで見ても、ほとんど同じように表示されます。それは、各ブラウザの初期値をファンブログのスタイルシートでリセットしているからです。

HTML5で縦書き年賀状1

「縦書きHTML」でみかんさんから質問をいただいたので補足します。
ただし、その時の記事に書いてある通り、これはInternetExplorerでしかできません。よって、この記事はInternetExplorer以外で見るとレイアウトが崩れます。

これはWebサイトを作るのには不適格な機能ですが、年賀状印刷には使えます。

「HTML5で縦書き年賀状」というタイトルですが、技術的な内容のみで、レイアウトについては扱っていません。

昔、よく「このサイトはNetscape Navigatorでご覧ください」とか
「このサイトはInternet Explorer用です」とか書いてあるサイトがあって、非常にむかつきました。客に制約を課すな！と思うんです。

ですがこの記事においでのみなさん、この記事だけはInternetExplorerでご覧ください。

HTMLでは半角スペースや改行がいくつ続いても半角スペース１個分として扱われます。

説明はしませんが、全角スペース、つまり日本語はこの限りではありません。

つまり、半角スペースを１０個続けた後に「あいうえお」と書いても表示結果は下のとおりですが

あいうえお

全角スペースを１０個続けた後に「あいうえお」と書くとこうなります。

　　　　　　　　　　あいうえお

便利ですが、これでは欧米人は困ってしまう。
もちろん半角スペースを使ってでも空白を長く取ることは可能です。
今回は、「HTMLで空白を作る方法、いろいろ」の巻。
“HTMLでの空白” の続きを読む