8月は働くよー！お盆休みってなぁに？おいしーの？ ボーナスってなぁに？それっておいしーの？ さて、Webサイトを作成するときに、ルートパス（絶対パスとまとめられる事もありますが）で記載されてたり、SSIによるインクルードをしてたり、デフォルトインデックスのファイル名（index.htmlとか）を省略してたりすると、そのままローカルで確認するには不便があったり、場合によってはそもそも確認できない訳です。 そういう場合に、じゃあどうやって確認するか。となる訳ですが、毎回テストサーバとかにアップロードして確認していたら効率が悪いので、自分のPC（Windowsとして）で確認できたら嬉しいですよね！ じゃあ、どうしたら良いかって言うと、やっぱりWebサーバをローカルで構築するのが一番良いのかなと。 そうすると、自分のPCでちゃんと見れちゃう訳です。ンマーなんて素敵！ で、Webサーバって聞くと、サ

前回のエントリー「とっても使えるoverflowプロパティ。その使い方色々。」の補足で、Dreamweaver使ってコーディングする場合、デザインビューを使ってるとその部分が選択できない問題が有ったと思います。（確認しているのはVer8） 一時的に、宣言を取れば普通に選択できます。 さて、ちょっと必要になったんで、各プロパティを初期値にするCSSを書いておきました。 使いどころとしては、ごちゃごちゃ複雑になってきたCSSが何か当たってて変だったりする時や、取り合えず初期値に戻してみたい時ですね。 他に、ブログサービスとか使ってると、良く分かんない場合が有るのでそんな時にも活用できるかもしれません。 ダウンロードしたい方は以下よりお願いします。 initial_value.css DLするのとほぼ同じのを貼り付けておきます。 selectorsName { background-attach

class名やid名って付ける時悩みませんか？ 今でもボクは結構悩むんですが、そんな悩みを解決する為に、人さまのソース覗きまくってよくあるclass名とid名を拾ってきました。 これで、チョットだけ作業効率アップ！？ 2010年6月10日追記： この記事自体、2007年 1月15日に書かれてるんでかなり古いです。 あくまでも参考程度に留めてもらうのが良いかと思います。 今だったら、html5の要素を参考にしたりして付けるのが、今後の事を考えると良いのかなーと思います。 また、善し悪しの判断はせずに公開しているものですが、位置に関するのは仕様変更に弱くなるのでオススメはしません。 全体に使えそうな感じ wrap wrapper top-wrapper wrapperAll frame mframe all-frame container page pagetop all allContent

hamashunさんがTwitterで、 IE6を使って閲覧すると右上に『アナログ』って出るようにしようぜ。 って言ってたので、CSS HappyLifeでやってみた。 ボクが出来る2008年最後の大仕事でした。えぇ。 使いたい方は是非是非。 ちなみに、ボクが使った画像はコレです。自分のモニタで出るやつを参考にしました。 ご自由にお使いください。 IE6だけに表示させるにはどんなやり方でもいいっすけど、手っ取り早いのだったらハック使ってやるのがいいかと。 .analog { display: none; } * html .analog { display: block; position: absolute; top: 10px; right: 30px; } こんな感じで。 であ。 16日のお昼頃追記 ウチのアクセス解析を久々に確認してみたら、全体の50％くらいがFirefoxで40％

ボクたちみたいな、ウェブサイトを閲覧するのが当たり前の人間からすると、全く気づかない事に気づかされたりしたので、自分用メモ。 2008年2月14日の22：47頃に追記 ボクのただのメモ書きをもうちょっとちゃんと以下のエントリーで書いてもらってるので、あわせてご覧になって頂くと、良いかと思います。 Webアクセシビリティについての覚書 - ねんがんのWebユーザビリティテストに参加した ロゴクリック＝トップページに戻るという認識は殆ど無い。 トップページに戻る場合は、ブラウザの「戻る」ボタン。 サイドバーのバナーは、認知すらされない傾向が強い。 そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。 リストのマークとかのマーク部分をクリックしよーとする人が居る。 それにより、クリックできないと諦めるケースも。 プルダウン（ドロップダウン）型メニューは、近くのボタンを押

使う機会は滅多に無いんだけど、知識として知ってないと困ったりしたので、取りあえず現在主流だろうブラウザのハックを自分のまとめ用に。 実際の状況を確認出来るように、デモページもご用意しました。 必要あるか分かりませんがダウンロードも出来るようにしときました。 拡張子がshtmlとかなってるので、htmlにして下さい。 ハックのデモページ デモページのファイル一式ダウンロード(zip:14kb) 主要っぽいハック Win IE6までのハック（アンダースコアハック） .hackTest01 { _background: red; } Win,Mac IE6までのハック（スターハック） * html .hackTest02 { background: red; } Win IE7用のハック *:first-child + html .hackTest03 { background: red; }

通常外部リンクなどを別窓で開く際に、target="_blank"を使うと思うのですが、コレは非推奨となっているので、もうちょっと美しく別窓で開くにはどうしたらいいか？ と何度か考えた事がありますが、適当にぐぐると、JavaScriptを使うものが何点かあるけど、ソレもイマイチスマートじゃない。 例えば下記で紹介されているような。 http://allabout.co.jp/internet/hpcreate/closeup/CU20040118A/ コレはコレで今までの問題を解決するにはいいのかなーと思うのですが、ボクが個人的に求めているのはもうちょっとスマートなやり方。 今まで、この問題に関して深く調べた事が無かったのですが、雲のむこうの人からこういう方法もあるよ。 って教わったので、今回はそのやり方を紹介いたします。 取り合えず、何だかんだ言って結局JavaScriptを使うわけです

:nth-last-of-type() IE 6：× IE 7：× Fx 2：× Op 9.1：× Sf 2.0.4：×

中央配置のデザインで、ページ移動の際にコンテンツの量によってスクロールバーが出たり出なかったりするFirefoxさん。 あのズレ、気になる人っていますよね？ すぐ分かるように簡単なサンプルを用意しました。 http://css-happylife.com/template/11/ あ、当たり前だけど、Firefoxで見て下さいね。 コレを解消する為に以下のスタイルを適用させればズレがなくなります。 html { overflow-y:scroll; } 簡単っすね。 で、コレOperaじゃ解決出来ないのが難点。 overflow:scrollでズレないようには出来るけど、下が出ちゃうのはいけてない。 height:100%とかでもバーが出っぱなしにはなるけど、びみょーに出てはいけないバーまで出てしまう。 んーこの辺まで解決したかった... Track Back [1] スクロールバーを表示