CSSとSVGで曇りガラスのような効果を作る
2011年の9月に「CSSとSVG filterでガラスっぽい効果をつける」というのを書きましたが、これはFirefoxのみを対象としたものでした。 そこで今回はできるだけ多くのブラウザに対応したものを作ってみます。 完成品Frosted glass effect with CSS & SVG 背景画像にはWetFoto.comによる#246 Wetlook with Beautiful Brunette in Leggings and Jacket. Girl in black jacket, white wetlook leggings and skirt in boots, get wet fully clothed in the sea.を使用しています（リンク先はFlickrです）。 この画像はCC BY-NC-SA 2.0でライセンスされています。 背景画像にはBeryl Ch
IE8以下にHTML5をどうやって表示させるかの諸々 | ハナモゲラボ / 試行錯誤の実験人生
先日、いよいよというべきかHTML5での指定案件がありました。 Google ChromeやFirefox、Safariなどのいわゆるモダンブラウザは HTML5+CSS3への対応も早くてあまり支障もないのですが IE8ですらHTML5のタグが認識できない、というのは困りもの。 未だに使用されている事の多い、WindowsXPに至っては事実上IE8が最終バージョン。 となると、WindowsXPの人はごめんね！って事になってしまうのである。 そこで見つけたのがこのブログでした。 HTML5 & CSS3のクロスブラウザー対応方法まとめ （http://mae.chab.in/archives/1463） ここにはとてもわかりやすくまとめてありました。 まずはIE8以下にHTML5の新要素を認識させる articleやaside,sectionなどの新要素をIE8以下に認識させるためには G
CSS/HTMLのテクニックをクロスブラウザ対応（特にIE）にする方法のまとめ
17 CSS/HTML Effects with Cross-Browsing Alternatives サポートしないブラウザへの対応方法はJavaScriptを利用するなどいろいろありますが、その中の一つとして紹介します。 [ad#ad-2] 下記は各ポイントを意訳したものです。 幅の最小値・最大値 (IE included) RGBa (IE included) 不透明度 (IE included) 画像の回転・拡大縮小 (IE included) 背景をブラウザいっぱいに表示 (IE included) 画像無しのビュレット テキストのシャドウ (IE included) 複数のボーダー (IE included) ボックスシャドウ (IE included) 角丸 スクリーンリーダー用のコンテンツ ネガティブ値で指定したtext-indent Clearfix (IE inclu
CSS3で画像を一切使わずに美しいナビを作ってみた！（IE対策もしてみた） | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
今回はCSS3のみで１pxのラインまでデザインされたナビゲーションを作ってみました。 □demo □サンプル.zip 参考までに・・・こちらがPhotoshopで制作したナビゲーションです。（画像使用） 次にこちらが今回CSS３のみで作成したナビゲーションです。（画像不使用 Win7 Firefox12.0でキャプチャ） どうでしょう？さほど違いはないんじゃないでしょうか？ HTML <ul id="menu"> <li class="first active"><a href="#">デザイナー</a></li> <li><a href="#">プログラマー</a></li> <li><a href="#">社長ブログ</a></li> <li class="last"><a href="#">お空</a></li> </ul> HTMLソースはわずかこれだけ！ 本当はクラス名の「fir
ie9.jsを使うと出来ること、出来なくなること。 - Toro_Unit
最近ie9.jsを活用することが少々あるので、 いまさらながらまとめです。 配布場所 ie7-js http://code.google.com/p/ie7-js/で配布されています。 デモはhttp://ie7-js.googlecode.com/svn/test/index.htmlで見れます。 使い方 head内に [html] <!–[if lt IE 9]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script> <![endif]–> [/html] と貼り付けるだけです。フッターに貼ると誤作動起こす場合がたまに合ったような気がします。 できるようになること E > F 子セレクタ。直下の子要素にのみ適応するやつ。 E + F 隣接兄弟セレクタ。Eのすぐ下隣に居る弟要素
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ActyWay.com is for sale | HugeDomains
HTML5 & CSS3のクロスブラウザー対応方法まとめ