moss, me, disconnectedness

moss, me, disconnectedness
拡大する
作者:rorygallagher

カテゴリー クール ベーステーマ 無し ヘッダー 黒 (細)
登録日2007/10/17 更新日2008/10/11 インポート数601

このデザインについて

※簡単な説明。

幅800px(メインカラム550px・サイドバー185px)固定デザイン。

Win XP環境で以下のブラウザでの表示を確認しました。
IE5.5、IE6、IE7、firefox2、Opera9、Safari3beta
Mac IEでは目も当てられないデザインでしょうので、ご注意(overflowプロパティの指定による)。

背景画像を多用しているため、環境によっては読み込みが重い可能性があります。background-image指定を切ってもそれなりに表示されます。

フォトライフなどにアップした大きな画像(横幅550px以上)をそのままの大きさでどうしても貼り付けたい場合は、
<div class="photo-box"></div>
で当該画像を括ると横スクロールバーが出現し、デザインが崩れません(あまり有用ではありません)。


---------
※各種マークアップ表現について

このデザインでは、使用が想定されるほぼ全てのタグにスタイルシートを定義しています。気に入らない場合は適宜修正してください。また、気まぐれで修正を加える可能性があるのでご了承下さい。

aタグは一部を除いて下線表示を切っています。

多くのブラウザで斜体となる各種htmlタグ(qタグやemタグ)の表現はフォントカラーや下線での表現に変更しています。また、firefox2等で表示されるqタグのクォート記号は消しています。

insタグ、delタグはpタグ停止記法と組み合わせた場合、ブロック要素扱いでの挿入・削除が可能です。このデザインではボーダーによる区切り線表示と、:before擬似要素での修正時間の表示がされるようになっています。
pタグ停止記法と組み合わせない通常の場合(つまりpタグ、h*タグなどの子要素)インライン要素扱いになります。


---------
※謝辞・その他

はてなダイアリーにおけるスタイルシートの記述(主にセレクタやクラス指定の記述)については、
jwjさんのSEPTEMBER
http://d.hatena.ne.jp/designset/710
chepookaさんのstripes blue
http://d.hatena.ne.jp/designset/716
を特に参考にさせていただきました。ありがとうございました。

不具合等あれば、僕のダイアリーにでもコメントしていただけると幸いです。できる限り早急に対処します。
http://d.hatena.ne.jp/rorygallagher/20071015

更新履歴
2007-10-17:公開
2007-10-20:emタグ、qタグなどの表現を微変更。
2007-10-31:はてなスター/コメントアイコンをpngからgifに変更。
2007-11-03:表示確認ブラウザ追加。その他微変更。
2007-11-16:コメント欄の新しいHTML構造に対応。insタグ・delタグ周りを追加。emタグなどの表現を変更。背景画像微調整。他いろいろ。
2007-11-18:わからない程度にちょこっと修正。
2007-11-19:上付き文字、下付き文字の追加(span.sup, span.sub)など。
2008-07-15:ちょこっと更新しました。
2008-10-10:ちょこっと更新。

このデザインをインポートしたダイアリー

ヘッダ/フッタ/スタイルシート

ページのヘッダ

ページのフッタ

スタイルシート