Firefox 4: -moz-any() selector grouping – Mozilla Hacks - the Web developer blog
This is a re-post from David Baron’s blog. This feature has landed in Mozilla Central (trunk) and only available with a Firefox Nightly Build for the time being. Last night I landed support for :-moz-any() selector grouping. This allows providing alternatives between combinators, rather than having to repeat the entire selector for once piece that’s different. For example, it allowed replacing thi
WebFonts として利用できるフリーの和文フォント | ヨモツネット
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 意味なかったです多分。いまは HTML に SVG 混在でき
Internet Explorer
Internet ExplorerCss, UA, Style sheets y Marketing La decoración del hogar evoluciona constantemente, adaptándose a las nuevas tendencias y estilos que reflejan los cambios en la sociedad, la tecnología y las preferencias personales. En 2024, las tendencias de decoración para el hogar se caracterizan por una mezcla de sostenibilidad, tecnología avanzada, y un enfoque en el bienestar …
Opera Logo with CSS · David DeSandro
Opera Logo with CSS The Opera logo, rendered only with CSS, no images. Compare it with the real deal. Alas, best viewed in Firefox 3.6, Safari 4, or Chrome 5. Aside from another shameless plea for attention, this demonstration gives me a chance to look at some CSS3 properties across browsers. Border Radius In all the tutorials and hubbub over CSS3, elliptical border radius is one of those features
Firefox 3.6でFlashの上に position: fixed; な要素を表示できなくなった件 - gifnksmの雑多なメモ
Firefox 3.5までは "position: fixed; overflow: auto;" をHTMLの要素側に指定する Flashを読み込んでいる embed や object に wmmode="transparent" というパラメータを設定する これらのいずれかを行うことで，Flash で表示されたコンテンツ上にHTML要素を重ねて表示することができていました。(参考: Flashよりも前面にポップアップを表示する | Web scratch) このバグなんだか仕様なんだかよくわからない挙動を利用して，拙作のユーザースクリプトではポップアップを動画の前面に表示するなんてことを行っていましたが，Firefox3.6からは一部の要素だけがFlash上に表示されるという非常に中途半端な状況に…。 3.6で行われた何らかの変更が影響していると思うのですが，リリースノートを読んでみて
CSS3 「gradient」と「@font-face」
CSS3 「gradient」と 「ウェブフォント（@font-face）」 このページは背景画像を一切使用していません。 背景のストライプ模様はCSS3のbackground-image:gradient、フォントはCSS3の@font-faceでサーバー上に置いたフォントを読み込んで表示しています。これによって、閲覧者のパソコンにインストールされていないフォントも表示する事が出来ます。また、画像文字ではないのでコピーする事も可能。 SEOの一環としても有効です。 2010年1月現在、InternetExplorerとOperaではまだgradientに対応していない為、これらのブラウザでは背景は単色になります。フォントファイルはうっかり領収書５部ダメにできる筆圧を誇るふいさんの作った「まきばフォント」をお借りしています。 フォントの為のスタイル指定 @font-face { font
IE6 が死んだらできる10のこと（from Ajaxian） - oogatta のブログ
という記事がその昔 Ajaxian に挙がっていたので自分のメモとして残っていたモノを、そろそろ時期が来たかと言うことでこちらに再掲。 http://ajaxian.com/archives/10-cool-things-we%e2%80%99ll-be-able-to-do-once-ie6-is-dead-and-a-few-we-cant 子セレクタ（child selectors）が使えるようになる。 孫以下を除く直の子にだけ適用するセレクタが使えるようになります。 #bodyMain > p {} ul > li 24bit PNG の機能を全て使えるようになる。 アルファチャンネル付きPNGがネイティブで使えます。アンチ付き角丸を背景色毎に用意する必要が無くなります。 属性セレクタ（attribute selectors）が使えるようになる。 感覚的にいって class の3割
とっても使えるoverflowプロパティ。その使い方色々。
光の4戦士を買ったんすが、売り文句通りレトロな感じがしていいですね。 まぁまだ2, 3時間程度しかやってないんで、これからどうなるか分かりませんが時間を見つけてやって行こうかと。 さて、以前からoverflowプロパティは使い勝手が良いというか、使う場面が多いプロパティの一つですが、考えてみると色んな事に使ってるなぁ～と思ったので自分が良く使うのをまとめてみました。 あんまoverflowプロパティを使った事が無い方は、ビックリですよ！ これで、ソコの可愛いアナタもoverflowプロパティの虜になる事間違い無し！！（わかんないけど サンプルとかは以下よりどうぞ。 サンプルサイトを見る サンプルをダウンロード 基本的に、全てoverflow: hidden; の指定を足す事で解決したり実現出来る感じです。 01 clearfixみたいに使う まずは以前の「clearfixを使わないでやるに
Firefox 3.6、フォントによるデザイン差異を縮小 - Webオープンフォントフォーマット | エンタープライズ | マイコミジャーナル
Firefox web browser - Faster, more secure & customizable Firefox 3.0でフォントのカーニングや合字などのレンダリング技術が導入されるなど表現力の向上が実施されたが、システムで提供されているフォントを使ってレンダリングを実施するため、提供されているフォンとの違いによってレンダリング結果が変わってくることがあった。Firefox 3.5ではCSSのサポート機能として@font-faceに対応することで、この問題に対処している。@font-faceはレンダリングにオンラインフォントを指定できるようにする機能。レンダリングに同じフォントが使われるようになるため、その分レンダリングの差異を少なくできる。 Firefox 3.5 (Gecko 1.9.1)でサポートされているフォントフォーマットはTrueTypeとOpenTypeの2つ
難読モード/編集モードを備えたCSSエディタ·snap{css} MOONGIFT
snap{css}はWindows向けのフリーウェア（ソースコードは公開されている）。CSSの編集は何のエディタで行っているだろう。大抵テキストエディタか、オーサリングソフトウェアになるだろう。使い慣れたエディタで編集するというのも良いが、専門のエディタを使うと効率的になるかも知れない。 難読化モード snap{css}はCSSの編集を行うテキストエディタだが機能は殆どメモ帳レベルなのでご注意いただきたい。だが一つだけ大きなメリットがある。それが難読モード（Collapse code）と編集モード（Beautify Code）の切り替え機能だ。アクセスが多数発生するWebサイトではCSSの余計な情報（改行や空白、タブなど）を消してサイズを小さくするが、その処理を行ったCSSを読むのに威力を発揮するのだ。 切り替えはメニューやツールバーから簡単に行える。難読モードにすると余計な空白などが消え
3キャリア対応のCSS変換モジュールHTML::MobileJpCSS - komoriyaのはてなダイアリー
DoCoMo,EZweb,Softbankを共通の外部CSSファイルからスタイルを反映させるモジュールを作りました。 http://search.cpan.org/~komoriya/HTML-MobileJpCSS-0.01/ 3キャリア間での変換の必要性 DoCoMoでは外部CSSを参照できずインラインのみの対応となっています。 DoCoMoのインライン化についてはid:tokuhiromさんの作成したHTML::DoCoMoCSSこちらで対応が可能なのですが、3キャリア間で共通のCSSを参照するとなると属性の指定方法に微妙な差異が問題となります。 例えば小さいフォントを表示したい時は、 DoCoMo --- font-size:xx-small EZweb --- font-size:10px Softbank --- font-size:smallと属性の値が異なります。 hrタグ
EM Chart - Aloe Web Design Coupons
Using a relative unit such as EM is a great way to maintain the vertical rhythm of a web page when a user resizes text in their browser. Constantly reaching for a calculator to compute the correct EM value to use every time you need to is also a great way to drive yourself mad. Let’s say you have an H3 that’s 24 pixels. It doesn’t matter how the font-size is set (pixels, EMs, percentages, etc). Yo
CSSの実装状況で変わるボックスのデザイン方法
Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない１つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
IE7 バグ 早見表 by nobu
IE7 セレクタ (対応したセレクタ、対応してないセレクタ) 【新しく対応したセレクタ】 基本的なセレクタには対応している。 CSSのセレクタは、スタイルシートの適用先を指定するためのものだ。IE6では、CSS1.0のセレクタには対応していたものの、CSS2.0で追加されたセレクタにはほとんど対応していなかった。 http://journal.mycom.co.jp/special/2006/ie7beta2/002.html 新しく対応したセレクタ * A > B * A + B * A:first-child * A[属性名] * A[属性名="属性値"] * A[属性名|="属性値"] * A[属性名~="属性値"] 対応していないセレクタ * A:lang * A:focus * A:before * A:after A > B IE6は未対応 Aの1階層下の子要素Bを指定するセレ
サイトをリニューアルした時のメモ | Blog.37to.net
最終更新日 Sun, 28 Jun 2009 11:09:25 +0900 ブックマーク 半年ぐらい掛けて、少しずつ、ひっそりと、サイトをリニューアルしたので、その時のメモです。 当初は簡単なメモだったのですが、いつの間にかメモと言うには量が多くなってしまいました。 眠らせておくのも勿体ないのでまとめて公開します。 少し長いので（最近はむやみに記事が長い気がしますが）、最初に主な内容を書いておきます。 リニューアルの概要 HTMLのコーディング CSSとデザイン Movable Type4.2でのサイト構築 主に上記4つの内容となります。 HTMLとCSSは本職ではないのですが、ちょっと頑張りました。 リニューアルの概要 目的 古いデザインの一新 ブラウズ環境の変化に対する対応 (最新のブラウザに合わせた機能のサポート) (IEは7以上を基準にする。6はごめんなさい) 文字サイズの影響を受
古いブラウザでもCSS3セレクタを使ってWebページをデザインできるようにしてみた - latest log
uuCSSBoost.js は uuAltCSS.js に名前が変更になりましたが、一部の説明が記事を書いた当時の古い名前のままになっています。最新版では、uuCSSBoost.revalidate() は廃止され uuAltCSS() を呼び出すように変更になっています。 コードの解説を追記しました。 「最新の規格を実装したブラウザが登場しても、IE6 のせいで諦めるしかないのか」 「CSS3セレクタを古いブラウザでも使いたい!」 といった現場の声にお応えして、ほぼ全てのブラウザで CSS3 セレクタを利用したページデザインが可能になるJavaScript ライブラリを作ってみました。 特徴 軽いよ いろんなブラウザで動くよ(Firefox2+, Opera9.2x+, Safari3+, IE6+, Google Chrome1+) 95%〜98%ぐらいのシェアをカバーできるんじゃない
オブジェクト指向CSS、HTML複雑だがパフォーマンスと再利用性向上 | エンタープライズ | マイコミジャーナル
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers Kevin Yank氏がSitePointにFirst Look: Object Oriented CSSのタイトルのもと、オブジェクト指向CSS (Object Oriented CSS: OOCSS)に関する概要をまとめている。同文書ではオブジェクト指向CSSに関してはYahoo!のエンジニアであるNicole Sullivan氏が有名であるとし、Nicole Sullivan氏の発表資料をとりあげてOOCSSについて説明している。 説明によればOOCSSはなにか実体のあるフレームワークではなく、CSSの使い方に対する視点変更を求めるものだという。結論からまとめれば、ロケーションを特定してCSSを適用する方法をやめて、そのかわりより複雑なHT
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.virtuosimedia.com/tutorials/ultimate-ie6-cheatsheet-how-to-fix-25-internet-explorer-6-bugs
IDEA * IDEA
Google Box - CSS Transform Test