css3で画像の半透明化。IEも可。
201004/20 Category : WEB Tag : css, IE
わざわざ半透明の画像を作ったりしなくても、cssで透過指定が出来るって凄い便利。でも相変わらず、IEは未対応なのですが、なんとか出来るは出来るようで。
filter: alpha(opacity=50);
-moz-opacity:0.50;
opacity:0.50;
これでIEでも、cssで画像の透過指定が出来ます。
関連する投稿
IE6で文字が繰り返されるバグ。 (0)
CSSでIE6でも透過PNGを表示させる方法。 (0)
文字が折り返さず、枠をはみ出て表示される対処法。 (0)
デザインリニューアルと、W3C準拠しよう。 (0)
IEでのバグを修正。そろそろ雪らしいです。 (0)
文字が折り返さず、枠をはみ出て表示される対処法。
201004/17 Category : WEB Tag : css
URLや、「あーーーーーー」等、枠からはみ出て表示される文字を折り返す方法。css、ちゃんと基礎から勉強し直さないとだなぁ…。
word-wrap: break-word;
これだけで折り返して表示されるはず。。。他にもいろいろ対処法はあるみたいですが、僕が遭遇した環境では、この書き方でokでした。今後の為にもメモメモ。
関連する投稿
デザインリニューアルと、W3C準拠しよう。 (0)
IE6で文字が繰り返されるバグ。 (0)
CSSでIE6でも透過PNGを表示させる方法。 (0)
css3で画像の半透明化。IEも可。 (0)
css3で@font-face。IEも対応してるってのがびっくり。 (0)
IE6で文字が繰り返されるバグ。
201004/07 Category : WEB Tag : css, IE
またIE6。もう嫌だーって思ってましたが、すぐ解決策は見つかりました。詳細は下記サイト参照。
IE6で、文字(画像)が複製されてズレる – Archiva
複数のfloat要素が重なった場合に発生する事があるバグって事ですかね。上のサイトでも書いてありましたが、それなり有名なバグらしい。「Explorer 6 Duplicate Characters Bug」。とりあえず解決策は、実際に繰り返されるタグ（僕が見たのはpタグ）に「margin-right: -3px;」と振れば良いとの事。
うちの場合は、これだけで解決されましたが、バグが出る環境によると思いますので、もしこんな現象に遭遇したら試してみて下さい。
関連す...
css3で@font-face。IEも対応してるってのがびっくり。
201003/29 Category : DESIGN Tag : css
css3、ちょっとずつ見るようになりました。IEの対応はほぼ全滅のようですが、IE9ではちゃんと対応されそう？まぁそれはいいとして、css3はデザイナーやコーダーからすると、嬉しい機能が満載です。ただ現状では、残念な事に上記の通りIEはほぼ全滅。FirefoxやOperaは半分ほど。現状ではSafariやChromeがいい感じっぽいです。
で、そのcss3の機能の一つで、Webfonts機能ってのがあります。この機能、IEはVer4から対応出来ているそう。この機能を使えば、制作者が用意したフォントを、見ているユーザーのパソコンにそのフォントがインストールされていなくても、テキストとして表示させることが出来る機能。すごい便利。これがあ...
CSSでIE6でも透過PNGを表示させる方法。
201003/07 Category : WEB Tag : css, html, IE
便利だったので、メモ。まぁIE6はそろそろ消えそうな雰囲気もありますが…覚えておくに越したことはないかと。
下記にhtmlの例。
<li class="sample"><a href="#">サンプル</a></li>
下記にcssの例。
li a{
display: block;
width: 100px;
height: 70px;
text-indent: -9999px;
}
li.sample a {
background: url(sample.png);
}
li.sample a:hover {
backgroun...