死ぬまでに見ておくべきCSSデザインサイト集まとめ - GIGAZINE
ということで、今まで数限りなくネットのあちこちで紹介されてきたCSSデザイン関連のサイトがリスト化されてまとめられたようです。これだけあれば当分はブログなどのデザインのネタに困ることはなさそう。インスピレーションを得るのに使うもよし、デザインの参考にするのもよし、知っておいて損はないものばかりです。 リストは以下の通り。 CSS Beauty | CSS Design, News, Jobs, Community, Web Standards http://www.cssbeauty.com/ CSS Drive- Categorized CSS gallery and examples. http://www.cssdrive.com/ Stylegala - Web Design Publication http://www.stylegala.com/ CSS Mania http:
Wii欲しい！ - チープカ
Wii欲しい！ 13:35 | ウィーーーーーーーーーーー あとなんか画像張らなきゃいけないらしいのでスペアザ貼っておきます ちなみにYoutubeの動画を小さくするためには次のように書けばいいです。僕の作った公開デザインの中にはいくつかすでに使われていますけど。 .section object, .section embed{ width: 255px; height: 210px; }
「左上の魔術師」理論
Web業界のデザイン手法として、密かに流行し始めている「左上の魔術師」理論。 サイトとしての「見栄え」よりも、ユーザーの「目の動き」に着目したWebデザイン手法として注目を浴びています。 今回は、まず始めにWebサイトのデザイン別にユーザーの「目の動き」を解説します。 そして、実際にミリオン単位でユーザーを獲得しているサイトを考察することで、「左上の魔術師」理論を解説したいと思います。 1.カラム別Webサイトデザイン 2.昔はたくさんあったWebサイトデザイン 3.ページ単体を見に来たときのユーザーの目の動き 4.サイト全体を見たくなったユーザーの目の動き 5.ミリオン単位でユーザーを獲得しているサイトのデザイン 6.左上の魔術師とは 1.カラム別Webサイトデザイン 現在のWebサイトの多くは、「1カラム型」、「2カラム型」、「3カラム型」のどれかで構成されています。 このうち「2カラ
チープカ - はてなダイアリーのデザインを作るうえでのtips
CSS | 01:06 | はてなダイアリーのデザインをいじる上ではてなダイアリー独自に気をつけなくてはいけないものについて例をあげてみます。DOCTYPE宣言が互換モードまず一番問題になるのがここでしょうか。気をつけなくてはいけないのはなんといっても「IEで見るとwidthにpaddingがふくまれる」という点です。これはIE7になっても変わりません。そのためwidthとpaddingを同居させた要素を記述した場合にIEと他のモダンブラウザでは表示が変わってしまいます。回避策で一番簡単なのは同じ要素にwidthとpaddingを同居させないということです。ただしはてなダイアリーの構造上h1とかでwidthとpaddingを一緒に使わざるを得なくなったりするのでそん時はハックするしかないです。はてなのヘッダを透明にするはてなのヘッダは配色がしやすいように、画像部が透過されるようになりました
自分のサイトがほかのブラウザでどう見えるか試す「browsershots.org」 - GIGAZINE
1年ぐらい前からある無料サービスで、自分の作ったサイトやブログなどがほかのブラウザから見ると正常に見えているかどうかを画像として見せてくれるサービスです。特に自分が普段使っているOS以外の環境下での見え方がわかるので重宝します。 対応しているブラウザは、WindowsはFirefox1.0/1.5/2.0、K-Melon 1.0、MSIE 6.0/7.0、Mozilla 1.7、Navigator 4.8、Netscape 6.2/7.2/8.1、SeaMonkey 1.0。MacはSafari 2.0。LinuxはDillo 0.8、Epiphany 2.14、Firebird 0.7、Firefox 1.0/1.5/2.0/3.0、Flock 0.7、Galeon 2.0、Konqueror 3.3/3.4/3.5、Mozilla 1.7、Navigator 4.8、Opera 8.5
Lucky bag: : blog: 背景画像に使える透過 GIF
斜線やストライプの背景画像を Photoshop とかで作ると、色を変えたくなった時にそのたび作り直しってのが面倒。便利で使ってる人も多いかもしれない secondlife さんの Background Image Maker でもそれは同じかな。んで、Photoshop とかで作る場合に、線に色を付けて作るんではなくて、色を付けたい部分を透過にして作っておいて CSS で background-color を指定するやり方にすれば、色を変えたくなった時はCSS で背景色を変更するだけで良いじゃんって、Super Stripes を見て目からうろこ状態。早速インスパイヤしてみた！ 使ってみたい GIF 画像をダウンロードして、CSS で背景画像に。あとは、背景色で好みの色を指定するだけ。ちなみに、サンプルでは背景色を #fa0 と指定している。 斜線 oblique-line_1px.gi
はてなブログ | 無料ブログを作成しよう
帰省、寿司、陶芸体験 8/13（火） 妻の実家の墓参りへ行き、俺の実家へ帰省。風呂に入る前に子供達と外で水鉄砲で水を掛け合いびしょ濡れになる。最後のほうはどうにでもなれと思い、ホースやバケツで直接水をかけ合う。久しぶりの大胆な遊び方に子供たちは大声をあげながら騒いでいるが、田…
参考になる CSS 集
テンプレートいろいろ 特定の文書構造とセットの CSS ばかり。まあ、「テンプレート」ですからね、私の不満はいちゃもんに過ぎないのでしょう。これからはスタイルシートでデザインする時代だ、なんていってみても、レイアウト用の div 要素などはたくさん書いても、本文のマークアップには無頓着な人がほとんど。だからきちんと HTML の主要な要素について装飾を指定したスタイルシートには需要がない。 個人的には、以下のリストに示すスタイルシート群の方がずっと「参考になる」と思うのだけれど……。 Appendix > CSS List - outsider reflex CSS カタログ 「言葉 言葉 言葉」スタイルシートギャラリー スタイルシートライブラリ - W.F.N. CSSギャラリー ちなみに私の書くスタイルシートは、自分が使わない要素の装飾についてまともな指定がなされていないので、あまり汎
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
知っておくといいかもしれないCSS、8つの小技 | IDEA*IDEA
背景パターンいろいろ - DesignWalker
スタイルシートスタイルブック » Blog Archive » テンプレートいろいろ