Lucky bag::blog: Hot Entry

Hot Entry

注目の記事として、はてなブックマークにブックマークされた当サイトのエントリー一覧の上位 20 件を、ブックマークされた数が多い順に表示しています。このページ作成については、「外部の RSS を PHP で取得」で説明しています。

はてなブックマーク - www.lucky-bag.com の人気エントリー一覧

Lucky bag::blog: IE7 を含むモダンブラウザ向けの CSS ハックまとめ: Internet Explorer 7 は、 8 月にも beta3 がリリースされるかも知れないんだけど、今現在、IE7 beta2 を含むモダンブラウザに有効そうだと思われる CSS ハックを自分用にまとめておく。以前に IE 7 用の CSS ハックを紹介したことがあったけど、今回の Easy CSS hacks for IE7 - Nano See, Nano Do で紹介されていたハックは、比較的シンプルかも知れない。想定ブラウザは下記のとおり。バージョン 6 以...
Lucky bag::blog: line-height の値には単位なしが良いとされる理由: CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位を付けない方が良いのにとか思ったりする。その理由は Er...
Lucky bag: : blog: 背景画像に使える透過 GIF: 斜線やストライプの背景画像を Photoshop とかで作ると、色を変えたくなった時にそのたび作り直ってのが面倒。便利で使ってる人も多いかもしれない secondlife さんの Background Image Maker でもそれは同じかな。んで、Photoshop とかで作る場合に、線に色を付けて作るんではなくて、色を付けたい部分を透過にして作っておいて CSS で background-color を指定するやり方にすれば、色を変えたく...
Lucky bag: : blog: CSS デザインギャラリー: (X)HTML + CSS でレイアウトされているサイトを集めた CSS デザインギャラリー（ショーケース）サイトで自分が知っているものをちょっとまとめてみた。
Lucky bag::blog: CSS を作成する際のお約束: ボックスモデルやその他ブラウザのバグ以外で、ブラウザごとの描画結果の差異を少なくするためには、一番最初に全称セレクタを使ってブラウザのデフォルトスタイルを消してしまうのが手っ取り早い。
Lucky bag::blog: をちゃんと勉強しようと思いつつ、なかなか時間がなかったり、と言うか自分の積極性のなさが原因な訳で、いかんいかん、まずは何かやってみようって事で、とりあえず実験として当サイトのindex.xml（RSS2.0）をXSLTでHTMLに変換してみた。（RSS1.0とAtomはまた今度） MTのフィードご存じの通り、MTではフィードとしてRSS1.0、RSS2.0、Atom0.3が用意されています。で、ユーザは自分のお気...
Lucky bag::blog: グリッドレイアウトのための背景画像
Lucky bag::blog: 個人的に気に入ってるユーザースタイルシート: 今んとこ、ガチで不動のレギュラーメンバーな自分のユーザースタイルシートを晒してみる。userstyles.org で見つけたやつとか、自分で書いたやつとか。ちなみに、ユーザースタイルシートの管理は Firefox の拡張 Stylish で。 livedoor Reader 用各記事タイトルの下にある"元記事"って部分を URI に置き換えて表示 @-moz-document domain("reader.livedoor.com") { div.item_info { text-indent: -3em; } div.item_info a {...
Lucky bag::blog: dt と dd を横並び: 定義リスト dl 内の dt と dd を CSS を使って横並びさせるいくつかの方法の完全自分用メモ。
Lucky bag::blog: プロパティから CSS 仕様書（邦訳）へのリンク
Lucky bag::blog: 訪問済みリンクを一工夫する: ただ色を変えるだけではなく、画像を使ってもうちっと視覚的に分かりやすくするのもありなんじゃないのかなぁって思って、ちょっとサンプルを作ってみた。
Lucky bag::blog: CSS だけで Mac OS X の Dock 風ナビゲーション: Mac OS X の Dock っぽい動きを CSS だけで実現させるってアイデア。隣接セレクタを使ってフォントのサイズを変える事で文字の拡大を再現。
Lucky bag::blog: CSS で画像ポップアップ: JavaScript を使わずに、CSS を使ってサムネール画像の拡大画像をマウスオーバーで表示せる方法。
Lucky bag::blog: CSS の習得度レベル 5: あらゆる言語がそうであるように、プレゼンテーション言語である CSS にも修得度の段階がある。自分が思うレベル 5 を挙げてみた。
Lucky bag::blog: CSS Reboot に見るウェブデザインのトレンド: 以前にも取り上げた事があったけど、CSS Reboot ってのは、ウェブサイトのリデザインを期日を決めて一斉に行なうイベント。多分もう 3 回目くらいだと思うんだけど、5 月 1 日に 2006 Spring が行なわれたばっか。CSS Reboot のサイトでは、リデザインしたウェブサイトが紹介されてて、誰でも気に入ったサイトに投票できるようになっている。ちなみに、CSS Reboot のその場でクリックす...
Lucky bag::blog: Firefox で開いているタブを Expos: ネットで何か調べもんをしていると、Firefox のタブを余裕で 10 個以上開くなんて事がある。タブが増えればそれだけタブ幅が狭くなってくるわけで、そうなってくると当然ページタイトルが判別できなくなって、どれがどれか分かんなくなってくる。そんな時 foXpose をインストールしてれば、ステータスバーにある foXpose ボタンで今開いている全てのページをサムネール化、目的...
Lucky bag::blog: 固定幅ベースの elastic レイアウトサンプル: elastic レイアウトと言っても、固定幅ベースか可変幅ベース（とは言っても min、max-width による半固定だけど）のどちらかからのアプローチになるとは思う。当サイトでは、ここ1年半ほど可変幅ベースの elastic レイアウトを採用しているんだけれども、ちょっと思い立って固定幅ベースの elastic レイアウトのサンプルを 3 つほど作ってみた。文字サイズの変更に追随する elastic レ...
Lucky bag::blog: 俗に言う clearfix と言われるコードのバリエーション色々: clearfix ネタに乗っかってみる。スタイルシートをめぐる冒険: CSS実験室: clearfixの決定版を作る－モダンブラウザ編－ clearfixはちゃんと考えられてた .clearfix:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; } .clearfix { _height: 1px; min-height: 1px; /*￥*//*/ height: auto; overflow: hidden; /**/ } ホップ本でもうーたんが解説してるんだけど、構造に手を加えずに float を clear させるため...
Lucky bag::blog: CSS だけでフォトギャラリー: CSS だけでフォトギャラリーを実現してみる。サムネールにマウスオーバーで拡大画像を表示。サムネールクリックで拡大画像を固定。別の場所をクリックすると元に戻る。ってな挙動。
Lucky bag::blog: 使用中のブラウザの CSS セレクタ対応状況をチェックできる CSS Selectors testsuite: タイトル長っ！まぁ、そのまんまなのだけれども、今使用しているブラウザが、CSSのセレクタ（CSS3も含む）にどれくらい対応しているかチェックできる CSS Selectors testsuite - CSS3 . info が便利っぽい。 Start testing... をクリックでチェックが開始され、各セレクタの結果が緑色であれば対応、赤色であれば未対応ってな寸法。ただ、ひとつのセレクタに複数のテストを行うんで、そのう...