--年--月--日(--)
新しい記事を書く事で広告が消せます。
- ごんタイピング =無料タイピング練習=
-
初心者は、無料でタッチタイピングを習得できる『タッチタイピング講座』がおすすめ。
タイピングに自信のある人は、全国ランキングがあってレベル別に遊べる『無料タイピングゲーム集』で実力を自慢しよう!
2007年04月29日(日)
『画像の使用を極力控えてかっこいいCSSデザインをやってみよう大会』にまた作品を投稿しちゃった。
前回は「画像を一切使用しない部門」に参加したが、今回は「画像を極力控える部門 」に参加した。
「画像を極力控える部門」という名前から察することが出来ると思うが、画像の使用には制限がある。使える画像の数は5個で、使える画像の大きさは四方50ピクセル以内の小さい画像である。
使える画像の数が少ないので、ページを華やかに見せようとすると、同じ画像を再利用することになる。「画像を極力控える部門」では、この画像の再利用の仕方が大きなポイントだと思う。
単純に同じような用途で使っていては面白くないので、1個の画像で複数の使い方を試みた。
以下続き
CSS適用前と適用後の比較
「俺が作成したCSSファイル」を適用する前のHTMLファイルと、適用させた後のHTMLファイルを見比べて欲しい。
前回投稿したCSSファイルを「ごんたスタイル 1」、今回投稿したCSSファイルを「ごんたスタイル 2」とする。
IEで擬似要素「:first-letter」が適用されない
作品を作成中に、擬似要素の「:first-letter」を使用し、『IE(Internet Explorer)6』で表示確認をでしたところ、反映されていなかった。『Firefox』や『Opera』では反映されていたので、IEは「:first-letter」に対応していないのだと思っていた。
しかし、他の大会参加者の作品をIEで見た時に、「:first-letter」が反映されていることがあった。CSSの解説サイトで確認したら、IEの5.5以降のバージョンで対応していることが分かった。
反映されていた作品のCSSの記述と、反映されない俺のCSSの記述のどこかに違いがあるはずだと思い、検証してみた。
検証結果
違いはあった。それは単純な違いだったが、反映されるかされないかのポイントになるとは思ってもいない所だった。
綴りの間違いだと思って、何度も見直したが間違っていない。結局、違いは「:flrst-letter」と「{」の間に空白類文字(半角スペース,タブ,改行)が入っているかいないかだった。
Internet Explorer (Windows) CSSバグリストによると、「:first-letter」(擬似要素名)の後に空白類文字が入っていないと、そのセレクタは無視されるようだ。Windows IE6標準モードのバグ(不具合)らしい。
- 関連記事
- この記事のタグ
- ごんタイピング =無料タイピング練習=
-
初心者は、無料でタッチタイピングを習得できる『タッチタイピング講座』がおすすめ。
タイピングに自信のある人は、全国ランキングがあってレベル別に遊べる『無料タイピングゲーム集』で実力を自慢しよう!
トラックバック(言及リンク必須)
http://gontyping.blog.2nt.com/tb.php/69-bd367cb8
コメント(気軽にどうぞ)
ごんた(管理人)からの返事はありません。ごんたへの連絡は、メールフォームからよろしく。