タグ

関連タグで絞り込む (12)

タグの絞り込みを解除

CSSとieに関するkyotawebのブックマーク (12)

  • HTML5で組んでるならこの魔法のjsも入れておけっていう話

    現在、A!@attripさん発で話題になっている「たった2行でIE5.5～IE8をモダンブラウザの挙動にする魔法のJS」という記事。 Webデザイン界隈では当たり前のものですが、実はもうひとつ追加しておくといいかもしれないjsがあったりします。 Photo:html5 By michael pollak IE8以前のブラウザはどうにもこうにも開発者泣かせなわけですが、ie9.jsとcss3-mediaqueries.jsを突っ込むことで、モダンブラウザと同じ挙動にすることができちゃいます。 もう少し具体的に書くと、ie9.jsを組み込むことで、 position:fixed;に対応 max-width、max-heightに対応 属性セレクタ、擬似クラスに対応 margin:0 auto;でのセンタリングに対応 透過PNGに対応 opacityに対応 といったことが可能になります。要はCS

    HTML5で組んでるならこの魔法のjsも入れておけっていう話

  • 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

  • IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」:phpspot開発日誌

    IMGr :: jQuery Image Rounder IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」 $("imageElement").imgr(); と唱えるだけでクロスブラウザで画像の角を丸くすることが可能です。 $("imageElement").imgr( optoins ); でradiusやサイズ、色のカスタマイズが可能。 赤いボーダーで角丸の例 ボーダーを消した例 四方の角丸の操作も自由自在です。 IE 6, IE 7, IE 8, FF 3.6, Chrome 6.0, Safari 5.0, Opera 10.62 のブラウザ上でテストされているそうです。 関連エントリ CSSで角丸テクニック２５ 角丸を使った可愛いカレンダーピッカー実装JavaScript「jsDatePick」 CSS3で影付き角丸グラデーション付きのボタンを作成す

  • たった一行を追加するだけでIE6/7/8をCSS3対応にする -CSS3 PIE

    IE6/7/8でもCSS3の角丸、ボックスシャドウ、グラデーション、マルチバックグランドなどを使えるようにするbehaviorスクリプトを紹介します。

    kyotaweb
    kyotaweb 2010/07/18
    CSS3対応の決定版か！？　プロパティ
    リンク

  • CSS3のtransformやbox-shadowを主要ブラウザ全てに対応させるjsライブラリ・cssSandpaper - かちびと.net

    これ系はいくつかありますので 1つの選択肢として、という感じ ですね。css3のtransformや box-shadowをクロスブラウザ 対応させるjsライブラリですが、 特徴はプロパティを1行で統一 させる事が出来る点です。 css3のtransform（変形）、box-shadow（影）、gradient（グラデーション）ですが、gradientは不完全でした。しかしながらこのスクリプトを応用してアニメーションさせることも出来るようです。 各ブラウザで実装したものを比較していました。IEに限らず、主要ブラウザ全てをサポートしています。また、何より独自のプロパティを使うのですが、これが1行で済むので場合によってはなかなか楽では無いかと。 左がChrome、右がIE6です。テキストのドラッグも普通に出来ますね。 例・transform cssSandpaperを使用した際のtransfo

  • IE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」

    TOP  >  WebDesign  >  IE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」 WEBサイト構築においてもはや常識となったCSS。新たな仕様のCSS3が整備されつつあり、表現の幅をさらに広げてくれるものになっていますが、最新のブラウザのみ対応しており、IE6のようなシェアがある旧世代のブラウザは対応していないというのが現状です。そこで今日紹介するのはIE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」です。 全てのCSS3のプロパティが適応されるのではなく、角を丸くしたり、ボックスに影を入れたりテキストに影を入れたりといったCSS3の機能をスクリプトにｙほって再現するというものです。 詳しくは以下 スクリプトを読み込ませると言

    IE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」

  • IE6にPNG画像のアルファチャンネルを効かせる方法のまとめ | Blog hamashun.com

    最近はアルファチャンネルを含むPNG画像を利用したサイトが増えてきたように感じます。 2008年9月号のWeb Designing誌でも特集が組まれたりと、関心も高まっているようです。 ただ、そこで問題となるのはIE6のアルファチャンネル問題。 何らかの手段でこれを解決する必要があります。 少し前の仕事でこの問題を解決する必要があり、いくつかのライブラリを試してみたので、それをまとめてみます。 なお、img要素ではなく、CSSの背景画像で使用する場合として検証しました。 img要素にだけ適用したい場合には、もっとシンプルな方法があるかもしれません。 概ね共通する事 標準準拠のCSSのみでは不可能 IEの独自拡張の、filterプロパティを使う必要があります。 CSS内に記述する方法やhtcファイルを使う方法、JavaScriptを使う方法でも、結果的にはこのfilterプロパティのAlph

  • [CSS]気をつけたいIE 7のバグ -CSS-Discuss

    CSS-Discussにアップされている「IE 7 Bugs」の意訳です。 省略している箇所も多数あるので、原文も参照ください。 Internet Explorer Win Bugs - css-discuss 注意： バグには、IE7のみでなく、IE 5, 5.5, 6のものも含まれています。 公開されてから時間が経っているためか、ちょっと古いものもあります。 IEのフォントサイズのバグ フォントサイズの継承 IEの相対指定のフォントサイズの継承は、うまく機能しません。 相対指定を行う場合、emより%で指定を行う方が便利です。もし、em指定を行う場合は最初に%指定を行ってください。 例： body{ font-size: 100.01%; } ※100%の代わりに100.01%を使用するのは、Operaでの継承バグの回避のためです。 キーワード指定でのサイズ フォントサイズに「small

    [CSS]気をつけたいIE 7のバグ -CSS-Discuss

  • IEを華麗に撃墜する一行 - ぼくはまちちゃん！(Hatena)

    はい！ こんにちは！！！！！ 今日は、偶然ブラクラ発見しちゃったから、それをお伝えしますね！ これだよ！ <style>*{position:relative}</style><table><input></table> → サンプル (IEだとブラウザが終了しちゃうよ！ 注意してね！) IE6とかIE6のコンポーネントブラウザだと確実に落ちちゃうみたいだね！ IE7は確認してないけど！ tableとかtrの直下に、inputとかselectがあって、 そのあたりにcssの全称セレクタでposition:relativeがあたっているとダメなかんじかな！ ちなみにinputにstyleで直接relativeあてても落ちなかったよ！ なにこれ！ よくわかんないけど面白いね…！ FirefoxとかOpera大好きっ子は、 これをたくさんバラまいてIEのシェアをどんどん下げちゃえばいいと思うよ！

    IEを華麗に撃墜する一行 - ぼくはまちちゃん！(Hatena)
    kyotaweb
    kyotaweb 2007/08/07
    ブラクラでIEを落とす
    リンク

  • http://youmos.com/news/iefixed_htc

  • 半角文字の連続を表示させるとレイアウトが崩れる (AIRE-PROJECT BLOG)

    Webサイトを制作していてたまに指摘されるのが、半角文字を連続して入力したときにレイアウトが崩れるという問題。 これはブラウザがデフォルトでは英単語を単語の途中で改行しないから起きるんだけど、そんなめちゃくちゃ長い単語が入る場合があるんですか？と言いたくもなります。 ただ、ありえるのはURLとかe-mail。 これがサイドの狭いエリアに入ってくる場合。 IEの場合のみCSSで対応できるのでメモしときます。 IEでは、下記のスタイルと組み込むことで対応可能。 word-break: mode (e5) 行末の単語禁則処理を、normal（既定値：英文のみ単語の切れ目で改行）、break-all（英文、和文共に単語の途中でも改行）、keep-all（英文、和文共に単語の切れ目で改行）のいずれかで指定します。 (とほほのスタイルシート入門より) Firefoxはこれに対応していないため、制

  • スタイルシート［CSS］/フィルタ/半透明のグラデーションをかける - TAG index

    alpha は、半透明のグラデーションをかけるフィルタです。 グラデーションの形や透明度、方向などを指定することができます。 .example { filter: alpha(style=1, opacity=0, finishopacity=100, startx=0, starty=0, finishx=200, finishy=200); }

    スタイルシート［CSS］/フィルタ/半透明のグラデーションをかける - TAG index
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.