[Photoshop] WEB用画像を書き出す際png8でギザギザを減らす方法
透過pngを使う時、IE6が邪魔で、なかなかうまく使えない。 私も各種jsファイルを使ってコーディングしているのですが、background-positionが有効でなくて、結構困ることしばしば。 で、この前、小耳に挟んだこと。「png8の書き出しならIE6でも透過できる」 まじでか～って事でチャレンジ。 とはいえ、試したことがないわけでなありませんでした。 ただ、書き出しがgifとそん色ないぐらい汚かった。（特に画像との境界線） でも、出来るっていってんだから、もっときれいに書き出せるはず！！と色々パラメータをいじっていると、発見！！ プリセットの左下。多分通常は「透過ディザなし」となっているところを「誤差拡散法透過・・・」に変更。
IE+色指定無視でW3Cのサイトが読めなくなる話 | 水無月ばけらのえび日記
公開: 2024年3月7日16時40分頃 奇妙な現象に遭遇したのでメモしておきます。 IEを用意する (6でも8でもOK。たぶん7でもOK)インターネットオプションの「ユーザー補助」で「Webページで指定された色を使用しない」をチェックインターネットオプションの「色」で「Windowsの色を使用する」を外し、背景色に黒、文字色に白を指定こうすると、サイト側の色指定を無視して黒背景、白文字になる事が期待されます。この状態でもちゃんと読めるようになっている必要があるわけですが、http://www.w3.org/TR/WCAG20/ にアクセスすると……なんと、背景がほとんど真っ白で読めません。これはひどい。WCAG に限らず、W3C のサイト内のほとんどのページで真っ白です。 どうも、http://www.w3.org/StyleSheets/TR/W3C-REC の末尾にある という指定が
[CSS]スタイルシートを自動でIE6対応にするオンラインサービス -ie6fixer
手元のスタイルシートをフロートやネガティブマージンなどIE6のバグを回避する記述を自動生成するオンラインサービス「ie6fixer」を紹介します。 ie6fixer IE6に対応したスタイルシートを生成する方法は、以下の手順です。 「master stylesheet」の欄に、スタイルシートを入力。 「Give me my ie6 fixes」ボタンをクリック。 以上で、IE6のバグに対応したスタイルシートが生成。 IE6のバグに対応している箇所は、現在のところ下記の通りです。 「min-height」は、「height」に変更。 「float」は、「display:inline;」を追加。 「position:relative;」は、「zoom:1;」を追加。 ネガティブマージンは、「position:relative; zoom:1;」を追加。 「overflow:hidden;」は、
IE6 dl,dt,ddの擬似テーブルで3pxのずれを直す方法 - develo.org
HTML、CSS、Javascript、デザイン、絵を描いたり。 このページの先頭へ戻る
web制作ブログ | #001.「オブジェクトを指定してください。」[JavaScript]
「オブジェクトを指定してください。」 たまにIEで出てくるエラーメッセージです。 通常であれば関数が定義されていないなどの原因が一番考えられるのですが、関数が定義されているにもかかわらずこれが出てくる事があります。 しかも、FireFoxでは問題なく動いていてIEでだけエラーが表示されるので、わけがわかりません いろいろ試してみると、わかるのですが明らかにIEに限ってheadタグ内で書いている、javascriptが読み込まれていないというのがわかりました。 ここまでくるとなんとなくわかるんですけど、文字コードの設定をしてあげないとうまく読み込まれないらしいのです。そこで、<script>タグの属性にcharset="Shift-JIS"という感じで書いてあげると問題が解決されました。 ※ここで設定している文字コードはjsファイルの文字コードに合わせる必要があります
IE PNG FIX 2 (iFFALSE.log | takuyaな日々 ver.2)
なんかここにWEB関係のこと書くのは久々な気がするんですが、 これは忘れぬうちに書いておかねば！と思ったので、メモメモ。 IE6で透過PNGを表示するライブラリ IE PNG FIX 2 これ、超イイ！！ ＊この記事、数日前に書いて後日公開しようと思ってたんですが、 今日本屋で「Web Designing ９月号」を立ち読みしたら、 ”透過PNG+CSSデザインがやってきた！”という特集が組まれていて、 しかもIE PNG FIXもことも掲載されていて。 「なに？！おれのギャリック砲にそっくりだ！」ばりに衝撃で、 なんかこの記事見て書いたって思われるのもしゃくなので、 公開は見送ろうかと思ったんですが、IE PNG FIXに関しては 紹介だけで使い方は書いてなかったのでやっぱり公開することに。 なんか後出しで寂しい感じですが、自分のやってることも 割とタイムリーだったってことにちょっ
IE6のバグのまとめ - Webtech Walker
XHTML+CSSでコーディングするときにブラウザのバグを知っているか知らないかでは大きく違いますよね。とりわけ他のブラウザよりバグが多いIE6さんのバグをまとめてみることにしました。そろそろIE7の自動配布が始まるころなので忘れないうちにということで。 とは言ったもののIE6のバグを改めて見てみると多い･･･多すぎるよ！逆にこれだけのブラウザがあるからこそコーダーという職種がある気さえしてきます。 今回は『CSSバグ辞典スレッド』の要約のWinIE CSSバグリストからIE6のバグを抜き出して自分でわかりやすいように種類わけしてみました。これで全てではないですがこれだけ知ってればかなりのケースで対応できると思います。 2012/07/31 追記: リンク先がなくなったのでリンクを外して一覧だけ残しときます。 ちなみにこの種類分けも厳密ではないのであしからず。 ボックスモデル maring
単語帳 - *単語帳
単語帳 - *単語帳 目次 単語帳 graceful degradation production roll-your-own sanity check content backlink Only a click away. context industrial-strength less-is-more, more-is-less markup 単語帳 by YomoYomo**** 翻訳をしていて気になった単語や言いまわしに関するメモ。どこまで一般に通用する内容かは保証の限りではない。 上に新しいのが来た方が見やすいので、そうする（2001/11/02）。 graceful degradation 技術関連の文章を訳していて、「graceful」という単語を目にすると、場違いな感じがして、妙にたじろいでしまうものだ。もちろん「優美な」という意味ではない。 大部分のインターネット・ユーザ
IE6でfloatした要素が兄要素のmarginを継承（？）する｜WALK SLOW, AGAINST THE FLOW.｜BLOG
出現条件を説明するのが難しい。IE6はfloatを指定した要素の親要素にwidth属性を指定するとfloatした要素の高さが親要素に含まれるバグがあります（詳しくはIEでfloat属性を指定した要素の親要素のborderが消えるバグを見て下さい）。このバグが発生している場合に、float属性を指定した子要素が兄要素に指定されているmargin-bottomを継承するみたい。 実際には兄弟要素の属性を継承することはないと思いますが、継承しているとしか思えない挙動です。 IE6でfloatした要素が兄要素のmarginを継承（？）する例 親要素が“parent”、その子要素で“child1”、“child2”、“child3”。“child2”、“child3”は margin-bottom:0;を指定しているにも関わらず下に余白が発生。このスクリーンショットのソース 最後にfloatを指
IEで指定どおりのfont-sizeにならない | d-spica
IEで指定どおりのfont-sizeにならない 2008-05-18 0 0 XHTML/CSS CSS, font-size IE との兼ね合いで，font-size は%で指定しておくのが，いちばん無難だと思うのですが，IE6, 7 にちょっと痛いバグがありました。 小さなサイズの文字が指定どおりの大きさにならないのです。 11px以下のフォントが指定より大きくなる まず，font-size のページを IE6 または IE7 でご覧ください。 順にフォントサイズが小さくなっていくはずなのですが，74%から72%あたりの日本語のフォントサイズが一旦大きくなっています。その後71%から 60%のところまで，日本語フォントはサイズが変わっていません。 FIrefox の場合と比べると，よく分かるかもしれません。 %で指定された font-size は，最終的にpxに変換され，端数処理して整
IE6にPNG画像のアルファチャンネルを効かせる方法のまとめ | Blog hamashun.com
最近はアルファチャンネルを含むPNG画像を利用したサイトが増えてきたように感じます。 2008年9月号のWeb Designing誌でも特集が組まれたりと、関心も高まっているようです。 ただ、そこで問題となるのはIE6のアルファチャンネル問題。 何らかの手段でこれを解決する必要があります。 少し前の仕事でこの問題を解決する必要があり、いくつかのライブラリを試してみたので、それをまとめてみます。 なお、img要素ではなく、CSSの背景画像で使用する場合として検証しました。 img要素にだけ適用したい場合には、もっとシンプルな方法があるかもしれません。 概ね共通する事 標準準拠のCSSのみでは不可能 IEの独自拡張の、filterプロパティを使う必要があります。 CSS内に記述する方法やhtcファイルを使う方法、JavaScriptを使う方法でも、結果的にはこのfilterプロパティのAlph
CSSの:first-letterの記述でIEが落ちる - Hato-Style - Note
CSSの:first-letterの記述でIEが落ちる 個人運営のブログのHTMLのマークアップを書き換えた際に見舞われたトラブル。 Firefox 2,3/Safari 3/Opera 9.5/IE 7,6,5.5,5.0/MacIE 5.2 で検証したのだが、スタンドアローン版IE6.0でだけコーディングしたページを開くとIEが強制終了する現象が発生。Microsoft Virtual PC 2007 SP1のゲストOSにインストールされている通常版のIE6は問題なかったので気が付かなかったのだ。スタンドアローンだから仕方ないのか...細かい一部のリビジョンでは発生するのかもしれない。 デザインが崩れるのはまだしも、ソフトがいきなり落ちるのはさすがによろしくない。まず何が原因なのか調べてみた。 HTML の記述におかしな所がないか調べる。文法チェックもかけてみたが問題ない模様。
IE：floatでレイアウトが崩れる理由がaltにも… (I-and-R 【帯広/oma/web/ホームページ制作/デザイン/】)
今日、cssでカラムをfloatさせている際に、驚きの出来事がありました。 IEで親の幅に合わせてピタピタに左右のカラムのwidthを設定すると、レイアウトが崩れる…ってのはよくあることですが、なんと、そんなわけでもないのにレイアウトが崩れたのです。 原因を探しても探しても、どーーーー頑張っても見つからず…。 だって、ピタピタにしたわけじゃないんですもの。余裕がある上に、leftとrightで分けたんですもの。 そこで、最後の手段的なものとして、アテで入れていた<img src="#" alt="*******" />のalt部分を削除してみました。altだけ適当に長いものを入れてたんです。 するとどーーーでしょーーー！ レイアウトが直った…。 ま、まさかこのaltがジャマをしてくださっていたとは…。 こんな作り方をされる方はめったにいないでしょうが、もし、IEでfloatした時にレイ
クロスブラウザのためのHTML/CSSのテクニック集 | コリス
anthonyshortのエントリーから、クロスブラウザのためのHTMLとCSSのテクニックの紹介です。 How to get Cross Browser Compatibility Every Time 簡単な意訳なので、詳細やキャプチャは上記エントリーを参考ください。 サマリー doctypeはstrictを使用し、正しいHTML/CSSを使用してください。 スタイルをリセットするスタイルシートを使用してください。 Firefoxでのレンダリングのために、テキストのスタイルシートに「-moz-opacity:0.99」を指定してください。 Safari用には「text-shadow:#000 0 0 0」を使用してください。 画像のリサイズをCSS/HTMLで行わないでください。 全てのブラウザでフォントのレンダリングを確認してください。 「Lucida」は使用しないでください。 テキ
IE６でたまにおこるコメントアウトによるバグ
これには泣かされた。 firefoxの場合 IE６の場合 上の図のIE６の場合のところの下の方に”している内容物右”というのがある。 なにこれ？ そしてよくよく調べてみるとこれはｈｔｍｌでのコメントアウトによるバグらしい。 フロートしているタグとタグとの間に<!--コメントアウト-->をいれるとこういうバグがたまにおこる。これがたちの悪いことに解消法が<!--コメントアウト-->を消すしかないというのだ。他にあるという人は是非教えてほしい！ サンプルを作ったのでとりあえずIE６で見てほしい。 サンプル
外部リンクだけにアイコンをつけることのできる CSS のセレクタ | ヨモツネット
概要 リンクで、外部の Web ページが参照先のときにアイコンなどをつけて区別するケースがよくあります。 そのときに、参照先が外部の Web ページの a 要素だけにスタイルを適用するための CSS コードです。 動作確認用の demo この方法は外部リンクの a 要素だけに class 属性をつけるというような処理が必要ないので、CMS やブログのエントリーなどにいいかもしれません。 似た方法で JS でまとめて class 属性を付与する方法もありますが、CSS だけで完結したほうがスマートかなと思ったのでサンプルを作りました。 demo で使用した CSS コード a[href^="http"]{ background:url(img/ico_conductor.png) no-repeat right center; padding-right:15px; } a[href^="h
IE7 修正済みバグ一覧
修正済みバグ一覧 以下の一覧は、IE7で修正されたバグである。IE6以下では問題が発生する。 バグ 関連タグ/プロパティ 症状 リンク XML宣言によって表示モードが変わる問題 <?xml?> XML宣言の記述があるとQuirksモード(下位互換モード)で表示される。 解説: beta2 02-01 / 問題回避: 正式版 03-03 文字より小さな高さ指定が無効になる問題 height 要素に指定した高さが内包する文字より小さい場合、高さの指定が無効になる。 解説: beta2 03-01 / 問題回避: 正式版 03-03 置換要素を含む行の高さが変わる問題 line-height 画像などの置換要素を含む行で、ブロック要素に対して指定したline-heightプロパティの値が無効となる。 解説: beta2 03-03 / 問題回避: 正式版 03-04 背景画像の閲覧領域に対する固
表について
17.1 表概論（Introduction to tables） 表はデータ間の相互関係を表現する。 文書作成者は、構造化言語によってそれらデータ間の関係を指定し、CSSによって視覚表現、音声表現の体裁を指定する。 文書作成者は、セルの矩形格子として表の視覚整形を指定する。 行と列は、複数まとめて行グループ・列グループとして扱える。 行、列、行グループ、列グループ、及びセルには、それぞれの周囲にボーダーを描くことができる（CSS2にはボーダーのモデルが2種類ある）。 また、特定セルのデータの水平・垂直位置を操作したり、ある列・行に属する全セルのデータ位置を揃えることができる。 また、ヘッダやデータを読み上げる方法など、表の音声出力も制御できる。 音声出力でセルより先にヘッダを読み上げるために、構造化言語のセルとグループにはラベルを付けることができる。 その結果データが適切な順序で出力され、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
NealGrosskopf.com l CSS Browser Hacks For Firefox, Opera, Safari & Internet Explorer
PNG Overlay Demo