理想のCSSスキンのかたちを求めて - 3ping.org
2007.12-30 Ninja Style 完成。(年内に間に合った!) 問題の修正とか、アイコンがついたりいろいろ変わっているので、新しいものを使ってください。 表示確認 Download: Ninja Style 2007.12-27 当初配布していた暫定版のNinjaスキンに１箇所すんごい不具合がありました。 ボックスの高さを揃えるテクニックには、落とし穴があったようです。その不具合の表示と、原因を記事末尾に追記しましたので参照してください。 このテクニックを利用する際は皆様も注意してください。解決方法も模索しています。 僕が考える理想のCSSスキンとは、以下の条件を満たすものです。 ユーザーが好みの形に変えやすい CSSに詳しくなくても1.が可能 適当に編集してもレイアウトが崩れにくい 少しの調整でイメージを大きく変えられる ユーザーのカスタマイズ意欲を掻き立てる 現在のVic
Tag Cloudのスタイル - 3ping.org
タグクラウドの必要性についての是非はここでは置いておいて、このアイテムのデザインって色々考えさせられますね。 Vicuna CMSでも真面目に対応しようと重いケツを上げましたので、とりあえずサンプルとなるCSSスタイルを色々と書いてみました。 表示例とCSSファイルを置いておきましたので、気に入った表示があったらどうぞ使って下さい。 2007.10/21 追記・編集 Tag Cloud 10,11,12で.level5のフォントサイズが.level4と同じになってたのを修正 応用編としてTag Cloud 13を追加 単純に該当する記事が多いタグが他より目立てばいいだけなので、大抵のスタイルは大小の区別で表示しているけど、それだけじゃちょっと味気ない気もするので サイズ 色 明暗 彩度 色彩 形 というところでタグの強弱をより強調してみました。 HTMLは以下のような要素とクラス名で作って
CSSの記述テクニック 階層宣言コーディング - 3ping.org
2007-04-02追記 この記事は2007年4月1日にエイプリールフールネタとして書かれたものであり、紹介しているCSSの宣言ブロック内にセレクタを記述する方法は不正な書式であり無効です。 検索・他の記事から訪れた人は勘違いしないように注意してください。 CSSの記述はセレクタを並列に定義していくので、視覚的に構造を表すことができません。ここで定義グループごとにファイルを分割して管理したりする方法が有効になるのですが、これもXHTML文書の構造を頭にいれておかなければならないし、文書とビジュアルの結びつきをきちんと設計しなければ分割する意味がなくなってしまいます。 今日は、これらの弱点を埋める「階層宣言コーディング」という記述方法を紹介します。 次の記述は単純に文脈セレクタを使った記述です。 p.caution { color: red; font-weight: bold; } div
ロゴとか作るときに使える地味なテクニック - 3ping.org
ウェブ製作では、閲覧者の環境にないフォントを使用するときは画像として製作してimg要素で貼り付けたりCSSで背景画像として表示させたりすることがありますが、そういうテキストを含む画像を作るときにはFLASH8のFlashTypeで作ると通常のアンチエイリアスより綺麗にできちゃう。 FlashTypeっていうのは、WindowsXPに搭載された ClearTypeと同じ仕組みのアンチエイリアス技術で、液晶モニターでは特にその視認性が優れています。ClearTypeは日本語フォントには対応していませんが(Vistaの新日本語フォントのみ対応)、FlashTypeでは英字・日本語フォント全てに対応しており、カスタムアンチエイリアスパネルで細かく調整できます。 次の画像はPhotoshopで製作した通常のアンチエイリアスと、FlashTypeを比較したものです。 中間色ではそれほど変化はみられませ
MTで実践 - CSSのモジュール化による管理方法と遊び方 - 3ping.org
1年ほど前からMAQUEというMovable Typeのテンプレートを配布しているのですが、利用者も増えて色々とフィードバックをもらい続けていたので、それを活かして新しいものを作りました。βテストも終わって細部を修正して正式リリースしたのでMTユーザーやMTに興味ある方はみてください。そして、それで実践したCSSファイルのモジュール化による管理方法とカスタマイズ方法について解説します。MTユーザーでない方もローカルで確認できるパッケージがあるのでよかったらいじくってみてくださいね。 Movable Type テンプレート mt.vicuna Movable Typeのデフォルトソースを1から書き直し、シンプルで軽量、XHTML1.0 Strict DTD準拠です。基本的には1つのテンプレートソースに対して好みのスキンをあてこむ形で色々なデザインのウェブログが作れるようになっています。ごちゃ
DT DDを横並び - 3ping.org
IE6ではDDが2個続くと数pxずれる。 DL,DT,DDを強引に表のように表示するやり方だけど、データが表ならTABLE要素を使おう。 Comments:15 アサノ 2005年8月24日 12:27 今まさに仕事でその数 px の件 （厳密には WinIE6 で 3px?）で悩み疲れてて、もの凄い無理矢理な方法で解決してます・・。どっかに晒しとこうかなあ。 wu 2005年8月24日 12:29 え・・！この数px消せるなら、強引な方法でも知りたい!! っ!! アサノ 2005年8月24日 12:33 うお。まじすか。ほんじゃ自分とこにでも晒しときます。 アサノ 2005年8月24日 13:29 とりあえずここに置いておきます。 http://www.mushline.com/junky/etc/20050824/dl_dt_dd_float.html 時間があれば後で説明ブロギし
デフォルトスタイルの差異を無くす CSS
2007-01-30更新 Yahoo UI Fonts CSS使用時の各要素のフォントサイズを変更する際の注意点を追加しました。 defalut.cssちょっとだけ修正 2007-01-18 更新 記事の内容も古くなり、Yahoo Libraryなどがでて更に差異を減らすことが簡単になったことから、これを利用し、スタイルも簡潔にシンプルに記述しなおしましました。前よりも使いやすくなったはずです。前回配布していたものとの変更点は次のようになります。 定義グループにアウトライン番号を記述 ベーススタイルのデザインをシンプルに記述し直し 使用していたカラーを一部を除いてモノトーンに変更 Yahoo Library Fonts CSSを組み込み、各ブラウザで文字サイズが同一になるように修正 プロパティ記述順序をhail2u.net「CSS2 Specificationでのプロパティの出現順序」に沿
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
