タグ

cssとデザインに関するd6rkaizのブックマーク (8)

  • CSSの実装状況で変わるボックスのデザイン方法

    Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない1つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS

    d6rkaiz
    d6rkaiz 2009/08/03
    コメ欄の釣り針注意
  • Apple風のインターフェイスを実装するチュートリアル集

    Apple風のインターフェイスを実装するスタイルシートやスクリプトのチュートリアルの紹介です。 Create an apple style menu and improve it via jQuery

  • 高さの異なるカラムを揃えるスタイルシートのサンプル

    No Images 記事ページ h2-01に移動 column2 高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。 高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なるカラムを揃えるスタイルシートのデモ。高さの異なる

    d6rkaiz
    d6rkaiz 2008/11/02
    カラムをそろえるスタイルシート例
  • 3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)

    こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G(FOMA・WIN・3GC)端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末(FOMA・WIN・3GC)がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末(PDC・P型・C型など)を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運

    3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)
  • For Web Designers - Website Design Resources

    User submitted list of design resources for web designers and developers.

  • Tag Cloudのスタイル - 3ping.org

    タグクラウドの必要性についての是非はここでは置いておいて、このアイテムのデザインって色々考えさせられますね。 Vicuna CMSでも真面目に対応しようと重いケツを上げましたので、とりあえずサンプルとなるCSSスタイルを色々と書いてみました。 表示例とCSSファイルを置いておきましたので、気に入った表示があったらどうぞ使って下さい。 2007.10/21 追記・編集 Tag Cloud 10,11,12で.level5のフォントサイズが.level4と同じになってたのを修正 応用編としてTag Cloud 13を追加 単純に該当する記事が多いタグが他より目立てばいいだけなので、大抵のスタイルは大小の区別で表示しているけど、それだけじゃちょっと味気ない気もするので サイズ 色 明暗 彩度 色彩 形 というところでタグの強弱をより強調してみました。 HTMLは以下のような要素とクラス名で作って

  • CSSデザインカタログ

    対応ブラウザは Windows:InternetExplorer6,InternetExplorer7,Firefox2,Opera9 Mac:Firefox2,Opera9,Safari2 ですが,ブラウザによって若干表示が異なる部分もあります。 XHTML 1.0 でマークアップしてあります。 DOCTYPEスイッチによる標準モードに対応しています。InternetExplorer6 でXML宣言をし互換モードになった場合にも対応しています。 Netscape7,Mac InternetExplorer5 では期待通りに表示されないものがいくつかあります。 便宜上,分類コード(div011-hp,table010 など)を class名にしてありますが,実際にお使いの際には適切な class名に変更してください。 すでにお使いのCSSファイルに新たにCSSコードを追加した場合,既存

  • CSS Dock Menu

    May 08, 2007 15,301 Comments Tags: Javascript If you are a big Mac fan, you will love this CSS dock menu. It is using Jquery library and Fisheye component from Interface and some of my icons. It comes with two dock position: top and bottom. This CSS dock menu is perfect to add on to my iTheme. Here I will show you how to implement it to your web page. CSS dock menu screenshot Update: I no longer s

  • 1