タグ

cssに関するhedachiのブックマーク (21)

  • IEにおいてfilter:alpha(opacity)を設定しても、currentStyle.hasLayout=falseだとが透明にならない。 - Enjoy*Study

    IEで不透明度を変更するために下記のようなコードを書いたのですが、対象のエレメントのスタイルによって、不透明度が変わらない場合があることに気がつきました。(IE6、7共に) element.style.filter = 'alpha(opacity=50)';だめだったのは、div要素に対して background-colorだけを指定したもので、これに対してwidthまたはheightを追加指定すると、ちゃんと不透明度が効いてきます。 なお、JavaScriptではなくcss上でfilterの指定を行っても同様でした。(width,heigthがないと効かない) script.aculo.us(v1.7.0)ではどうしているんだろうと、ソース(effects.js)を眺めてみたところ、Element.setOpacityでは特に考慮しているような処理は見当たりませんでした。(その先のpr

    IEにおいてfilter:alpha(opacity)を設定しても、currentStyle.hasLayout=falseだとが透明にならない。 - Enjoy*Study
  • IE9、HTML5やCSS3、SVG対応を大幅強化へ - @IT

    2010/03/17 米マイクロソフトは3月16日、米国ラスベガスで開催中のイベント「MIX10」で次期バージョンのInternet Explorer 9のプレビュー版(Internet Explorer Platform Preview、以降IE9ppと略記)を初めてデモンストレーションした。同時にデモンストレーションページを含むダウンロードサイトも公開した。ただしGPUを生かした高速な描画ができるWindowsAPI、「Direct2D」「DirectWrite」を利用するためIE9はWindows XPでは動かない模様(ars technicaによる報道)。 新JSエンジン、HTML5/CSS3、SVG対応、GPU活用 IE9の改善ポイントは新搭載のJavaScriptエンジンによる速度向上、HTML5、CSS3、SVG1.1などWeb標準への対応強化、GPUによる高速で滑らかなレ

  • CurvyCorners - Beautiful rounded corners for your HTML boxes

    探偵のバイトのきっかけは単純なもの。 たんなるアルバイトのつもりだった。 名古屋でアルバイトできるのは嬉しいことだけれど。 それが探偵事務所とは、思いもよらない。 名古屋は良いけれど、探偵事務所って、、、 そのころ、資格をとるための勉強を頑張って、 試験を受けたけれど、学科は通り、 実技を落ちてしまったわたしは、就職する気分になれなかった。 受験して3週間ほどで結果が届き、すぐさま再試験の申し込みはしたけれど、、、 ちょうど、3ヶ月。友達と一緒に名古屋の学校へ通う。 その間は、両親も快く協力してくれたのだが、さすがに試験に落っこちてしまうと、態度が冷たく急変した。 で、アルバイトを探すことにしたのだ。 1日中、いつ機嫌の悪くなるともしれない母親と顔を突き合わせるよりは、 少しでも稼ぐくらいの方がマシだと判断したから。 まだ、名古屋の学校の再試験も控えているし、そこまで一生懸命に仕事はしたく

  • モダンブラウザとIEに対応したopacity指定 | PAOLOG

    cssで要素の透明度を指定する「opacity」プロパティの書き方をメモしておきます。 IE以外のモダンブラウザ 要素に透明度を与えるにはcssのopacityプロパティを使います。たとえば透明度を半分の50%にしたいときは次のように指定します。 opacity: 0.5; ですがこのプロパティはIE以外のモダンブラウザと呼ばれるものしか対応していません。IE6~IE8では独自拡張のfilterプロパティを使うことで同様の表現ができます。 IE6とIE7 IE6またはIE7では次のように指定します。 filter: alpha( opacity=50 ); opacity=50は透明度が50%の意味。opacityプロパティとは数値の指定が違うので注意です。 IE8 IE8では独自実装や、先行実装のプロパティを使うときは接頭辞「-ms-」を使わないといけなくなりました。さらに「:」以降の部

  • Bounce Effect | jQuery UI API Documentation

  • floatのclearについて

    ネタ元:mixiコーダー組合コミュ 「トピ立てるまでもない質問はこちら」トピックの質問97 以前「float関連の問題で覚えておくべき5つの対策 」でもfloatについて取上げたことがあるのですが、今回はfloatのclearについてのお話。floatの解除方法について。 そもそもどうしてclearが必要か α:親ブロックの高さが算出されず、背景が表示されないから β:後ろにくる要素にも影響がでる場合がある 多くの場合は、この2つが理由でしょうね。floatを解除しなければ表示が崩れたりするし。。。だから、多くの場合、floatをした場合はその後ろでfloatを解除する必要がある。 float要素の後に要素が来るかどうか floatをシンプルにclearさせるには、floatさせている要素の後ろで、且つ、親要素の終わる前までになんらかしらの要素がある必要があります。 図で言うAの位置に要素

    floatのclearについて
  • はてなブログ | 無料ブログを作成しよう

    2024年 買ってよかったもの2選 三幸のサーモン塩辛 いけないものをべてる気がする。背徳感がある。 出張で新潟に行った時、新潟駅のお土産売り場で買った。試べた時(うわ、これすごい)と思ったら、隣の知らないおっさんが「これは絶対に買わないとおかしい!」みたいなことを店員に言って…

    はてなブログ | 無料ブログを作成しよう
  • フロートとネガティブマージンまとめ:CSS | Tech de Go

    hedachi
    hedachi 2010/02/05
    firefoxで見るとこのページ自体が崩れているのがどうかと思う....けど参考にはなりそうなのでブクマ
  • サービス終了のお知らせ

    サービス終了のお知らせ いつもYahoo! JAPANのサービスをご利用いただき誠にありがとうございます。 お客様がアクセスされたサービスは日までにサービスを終了いたしました。 今後ともYahoo! JAPANのサービスをご愛顧くださいますよう、よろしくお願いいたします。

  • スタイルシートによる崩れない 2カラム 3カラム・レイアウト

    このウェブサイトは販売用です! desperadoes.biz は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、desperadoes.bizが全てとなります。あなたがお探しの内容が見つかることを願っています!

  • スタイルシートについての質問です。a:link,a:visited,a:hover,a:activeを使用してあるリンクの設定されたテキストの色を変化させています。…

    スタイルシートについての質問です。a:link,a:visited,a:hover,a:activeを使用してあるリンクの設定されたテキストの色を変化させています。通常ではページ内でリンクの設定されたテキストに全て同じ変化が起きます。これをテキスト毎に変える事は可能でしょうか? 例えば同一ページ内にリンクの設定されたテキストが2つあるとします。 テキスト1 →オンマウス時に赤 テキスト2 →オンマウス時に青 こういった事がやりたいのですがご存知の方居られましたら教えて頂きたいと思います。

    hedachi
    hedachi 2009/12/20
  • css-eblog.com - このウェブサイトは販売用です! - css eblog リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • 閲覧者がスタイルシートを切り替えられる機能を作る [ホームページ作成] All About

    現在のページで読み込んでいるCSS(スタイルシート)ファイルを、閲覧者がプルダウンメニューを使って(CSSファイルごと)切り替えられる機能を作ってみましょう。 CSSファイルそのものを動的に変更できる(置き換えられる)ので、ページの装飾やレイアウトを大きく変えられます。 複数のページデザインを用意しておいて、閲覧者が自身の好みに応じて切り替えられるようにしたり、画像素材配布サイトなどで、どのようなページデザインのときに素材がどのように見えるのかを確認させたい場合などに活用できるでしょう。 CSSファイルを動的に切り替えられる機能の例 下記のプルダウンメニューを変更すると、読み込まれているCSSファイルが変更され、ボックス内の装飾が変化します。試しに変更してみて下さい。 ※JavaScriptが有効な場合のみ動作します。 ※CSSファイルが新たに読み込まれるまで、数瞬の待ち時間がある場合があ

    閲覧者がスタイルシートを切り替えられる機能を作る [ホームページ作成] All About
  • <hr>要素のスタイル - CSS小技集

    ここでは<hr>要素のスタイルを定める際に注意しなければならない事を具体例を交えて解説します。 まずはじめに…。 <hr>要素(横罫線)はCSSを扱う上で意外に厄介な代物です。 表示スタイルについて、明確な決まりが無いからです。 このため、<hr>要素に画像を用いる場合、さまざまな問題に悩まされました。 それでも、最近ではインターネットエクスプローラ 7.0 までを除けば、多くの環境でそれなりのスタイルを実現出来るようになって来たようです。 ただ、殆どのブラウザにバグがあるのも事実ですが…。 ここでは、なるべく多くの環境でそれなりに<hr>要素のスタイルを定める方法について考えてみましょう。 主なブラウザでの<hr>要素の実装。 ファイヤーフォックスとオペラでの<hr>要素の実装。 ファイヤーフォックスとオペラでは、<hr>要素の実装を以下のように考えているようです。 枠線は境界線と見なす

    <hr>要素のスタイル - CSS小技集
  • IE6でよく遭遇するCSSのバグとその解決方法 | コリス

    Dave Woodsのエントリー「IE6 -CSSのバグとその解決方法」から、IE6でよく遭遇する3つのCSSのバグとその解決方法の意訳です。 IE6 - CSS Bugs and Fixes Explained IE6で、マージンが2倍になってしまうバグ IE6で、hasLayoutプロパティによって起こるバグ IE6で、小さい高さを指定した場合に起こるバグ IE6で、マージンが2倍になってしまうバグ IE6で、フロートした要素のマージンが2倍になってしまうバグと解決方法の紹介です。 下記のコードで、IE6はマージンが20pxになります。 sample:バグ #navigation{ float: left; width: 200px; margin-left: 10px; } #content{ float: right; width: 500px; margin-right: 10p

    IE6でよく遭遇するCSSのバグとその解決方法 | コリス
  • スタイルシート講座 - 超初心者のためのホームページ作成講座

    ◆リストマークを変更する (css file) ul.kuro{ list-style-type:disc; } ul.siro{ list-style-type:circle; } ul.sikaku{ list-style-type:square; } ul.suuji{ list-style-type:decimal; } ul.roma1{ list-style-type:lower-roman; } ul.roma2{ list-style-type:upper-roman; } ul.alpha1{ list-style-type:lower-alpha; } ul.alpha2{ list-style-type:upper-alpha; } ul.nasi{ list-style-type:none; } (html file) <ul class="kuro"><li>In

    hedachi
    hedachi 2009/09/25
  • background-position-スタイルシートリファレンス

    background-positionプロパティは、背景画像の表示開始位置を指定するプロパティです。 背景画像の表示開始位置を%値や数値で指定する場合には、値を横方向・縦方向の順にスペースで区切って指定してください。 ■値 位置を表すキーワードで指定 left,center,rightや、top,center,bottomといった位置を表すキーワードで指定します。この指定方法はそれぞれ、0%、50%、100%と指定しているのと同じです。 %値で指定 背景画像が表示される領域の左上からの距離を、横方向と縦方向の順で、%で指定します。例えば、background-position: 20% 40%; と指定した場合、表示される領域の左端から20%、上端から40%の位置が背景画像の表示開始位置となります。 数値で指定 背景画像が表示される領域の左上からの距離を、横方向と縦方向の順で、数値にpxな

    hedachi
    hedachi 2009/09/18
    あんまり使ったこと無いけど便利かも
  • 日記 | ヨモツネット

    blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTMLSVG 混在でき

  • z-indexの最も大きい値を取ってくる - 考え得る最高を常に行う

    zindexの最大値を取ってくる関数を作ってみた。 とりあえずモダンブラウザは全て動いてました。(IE7/Safari2-3/Firefox2/Opera9/NN7) コード var getLargestZIndex = function(){ var largestZIndex = 0; var defaultView = document.defaultView; var func = function(tagname){ var elems = document.getElementsByTagName(tagname), len=elems.length; for(var i=0; i<len; i++){ var elem = elems[i]; var zIndex = elem.style.zIndex; if (!zIndex) { var css = elem.curre

    z-indexの最も大きい値を取ってくる - 考え得る最高を常に行う
  • floatした際に背景が消える件(IE編)

    floatした際に背景が消える件(IE編) floatした際に背景が消える件でIEには『幅や高さを指定した要素ではボックスサイズの算出時にフロートを除外しない』というバグがあると説明しました。 逆を言えば、親要素に幅や高さを指定しなければFirefoxと同じ表示になります。 サンプルとなるhtmlは <div class="parent"> 親ボックス <div class="child"> 子ボックス </div> <div class="child"> 子ボックス </div> </div> とします。 これに対して div.parent{ background:#39FF6B; } div.child{ border:1px dotted #000; height:100px; width:100px; float:left; } このようなCSSを適用した場合、FirefoxとIE

    floatした際に背景が消える件(IE編)