Top
ご訪問ありがとうございマス!!
ブログちょこちょこ再開予定です。
みなさま、またよろしくお願いします☆

↑デザイン・アート部門
最高記録10位です☆
++最新の記事++
9/14【映画を観る】
NANA
9/14【雑記】
脳みそゲーム
9/13【愛犬と暮らす】
こんなに大きく
9/12【あなたとわたし】
ハッピーサマーウェディング♪
7/9【オンナの愉しみ】
エスニックブーム
7/2【あなたとわたし】
もめごと
6/21【あなたとわたし】
やきもち
6/20【映画を観る】
交渉人 真下正義
6/7【オンナの愉しみ】
10年ぶり
6/5【あなたとわたし】
すきなひと
6/4【あなたとわたし】
ふわふわ
6/1 【デザインとアート】 +others+
かたちあるもの
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30
Category
【あなたとわたし】
恋愛のコト、友達のコト。

【本を読む】
オススメ度と感想。

【音を楽しむ】
お気に入りのオンガク。

【映画を観る】
観るものは偏りがち。

【ブログ試行錯誤】
初心者なりの
スキンいぢり挑戦談。

【愛犬と暮らす】
わんこの話題。

【デザインとアート】
インテリアとか、
雑貨とか、好きな物。

【オンナの愉しみ】
美容、食べ物とか
ファッションのこととか。

【日々想うこと】
心の整理と日記

【雑記】
どうでもいいこと。
Comment
最新のコメント
cheap cheap
by FywAjata at 00:56
Greetings, ..
by Investblogger at 17:28
Ladies and G..
by Investblogger at 14:14
hypnotherapy..
by elizabeth at 06:22
[url=http://..
by orielmilm at 03:58
penis enlarg..
by hypnothera at 02:51
Recently fr..
by arabic fre at 01:02
[url=http://..
by orielmilm at 22:38
hypnotherapy..
by hypnothera at 14:31
Most downlo..
by boost free at 13:00
その他のジャンル
ファン
記事ランキング
ブログジャンル
画像一覧
Trackback
最新のトラックバック
watch Enemy ..
from movies review
Manchurian C..
from historical rev..
divx Hostage..
from uk film reviews
online Kanga..
from reviews of cur..
download thi..
from movie trailer ..
download a M..
from Download New M..
Mousehunt ip..
from review movies ..
Mousehunt ip..
from review movies ..
Birds, The v..
from movie trailers
download new..
from movies reviews..
Link
【動作確認】
Internet Explorer6.0/Netscape7.1
Opera7.53/Firefox 1.0
IE以外ご利用の方で
文字が見にくい方は
表示→文字のサイズなどで
変更してご覧下さい。
お手数をおかけします。
【トラックバックをする際のお願い】
アフィリエイト目的だと判断した
トラバは削除させて頂いております。
トラックバックは大歓迎ですが、
記事の中で紹介・もしくは
コメントがない場合も内容を確かめた上で
削除する場合があります。ご了承下さい。
皆さんネットマナーを守って
楽しくインターネットをしましょうよ(懇願)
++ css編集画面解説(3) ++
スキン編集の基礎知識シリーズ第7弾。
cssのどの部分が何を示しているのか解説しています。
前回からかなり間があいてしまいました・・・(^-^;)



++続き++


今回も、スキン編集→新しいスキン→3列のレイアウトで、
何も編集していないcssと見比べながら覚えてくださいね。

【DIV.POST】→下図の赤枠
 ポスト画面全体をボックス要素として指定します。
 投稿したときに表示されるタイトル、本文、コメント、トラックバックなど
 全てをまとめて1つのボックスと考え、メニューとの余白やテキストの位置などを
 指定します。(1画面に表示する本文を2つ以上に設定している場合、
 その2つ以上のポスト全部を1つのボックスと捉えてください。)

【DIV.POST_HEAD】→下図の黄色枠
 ポストのタイトルと下記の【DIV.POST_ADMIN】部分。
 ここでは、枠線や背景の色、余白などを指定します。

【DIV.POST_TTL】→下図の緑枠
 ポストのタイトル部分のテキスト。
 ここでは、テキストの色、大きさ、位置などを指定します。

【DIV.POST_ADMIN】→下図の青枠
 通常タイトルの横に表示される、「編集」と「削除」の表示。
 管理人にしか見えない文字です。

【DIV.POST_BODY】
 ポスト本文。一番かっこよく、かつ見やすくしたいところです。
 asamiのように、ポスト画面に画像を表示したいときは
 ここに背景として指定します。

【DIV.POST_TAIL】
 ポストの下に表示される、
 #by trickycat | 2004-10-30 00:41 | ブログ試行錯誤 | Trackback | Comments(0)
 ・・・とかの、テキストの位置などを指定します。
 ただし、リンク色は全体の設定が反映されます。
 さらに、テキストの大きさなどは、
 #と|ブログ試行錯誤|(カテゴリー)|Trackback|Comments(0)部分にしか
 反映されません。他の部分は別途設定するところがあります。

【DIV.COMMENT】
 コメント部分全体。
 コメント本文、入力画面を全て1つのブロックとして
 その周りの余白などを指定します。

【DIV.COMMENT_BODY】→下図のピンク枠
 各コメント本文のテキストを指定します。
 コメントされている文章のみに反映されます。

【DIV.COMMENT_TAIL】
 通常コメントの上に表示される、
 Commented by trickycat at 2004-11-20 20:51 x
 ・・・などのテキストを指定します。
 この場合は大きさなども全部に反映されます。

【DIV.COMMENT_INPUT】→下図の紫枠
 コメント入力部分の大きさ、余白などを指定します。
 これは、実際のテキスト入力画面の大きさではなく、入力画面がある部分の大きさです。
 全てのコメントの一番下から、ポストの外枠の下までと言えばわかりやすいでしょうか。

【DIV.COMMENT_LINE】→下図のオレンジ枠
 トラックバックURLと、トラックバックする(会員専用) [ヘルプ]
 という表記の下からコメントが表示されるまでの間に、
 ラインや余白を作りたいときに使用します。
 ちなみにasamiは何も表示していないので、{ }のように空白にしてあります。

【おまけ】
b0018207_3525374.jpg

 これはどこからどこまでを指定するんだろう?と思ったら、
 { }内にborder :1px dashed #000000;と入力して
 プレビュー、もしくは保存してみましょう。
 指定できる範囲に点線の枠線が表示されるのでわかりやすいです。

・・・今回はここまでです。
[PR]
by trickycat | 2004-11-22 02:59 | ブログ試行錯誤 ▲page top▲