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以外ご利用の方で
文字が見にくい方は
表示→文字のサイズなどで
変更してご覧下さい。
お手数をおかけします。
【トラックバックをする際のお願い】
アフィリエイト目的だと判断した
トラバは削除させて頂いております。
トラックバックは大歓迎ですが、
記事の中で紹介・もしくは
コメントがない場合も内容を確かめた上で
削除する場合があります。ご了承下さい。
皆さんネットマナーを守って
楽しくインターネットをしましょうよ(懇願)
++ スタイルシートの定義 ++
スキン編集の基礎知識シリーズ第1弾。
既存のスキンを使っていて、
ここがもうちょっとこうだったら・・・って思ってはいるけれども
いざ、スキン編集画面を開いても「なにこれ?!」みたいな。

今回は、基礎すらわかんないなんだよぉ!
・・・という人を対象に、スタイルシートについて書きたいと思います。

asamiもまったくの素人なので、間違いとかみつけたら
ご指摘頂けると嬉しいです。



++続き++


まず、スタイルシートを定義するにあたって、以下の名称を覚えてください。
p(段落)の文字の色を黒に設定するとしたら、こうなります。

p {color:black;}

pは、セレクタといい、{}内のスタイルを適用する対象を示します。
{}内は、宣言といい、スタイルの内容(色や大きさなど)を示します。

さらに、{}内は
{プロパティ:値;}といいます。

また、スタイルシートを定義する場所・・・というか方法は、
大きく分けて3つあります。

1)インラインによる定義

これは、html内のそれぞれのタグ(要素)に、個々に設定する方法です。

<p style="color:black;">文章</p>
↑p(段落)にstyle(文字色:黒)の属性を与える、という意味です。
例を挙げるので自分でやりたいことと当てはめて考えてください。

pにstyle(文字色:黒、文字の大きさ:10ピクセル)の属性を与える場合。
<p style="color: black; font-size:10px; ">文章</p>
複数の属性を与える場合は、続けて定義してください。

また、この方法だとこのスタイルは1カ所にしか適用されず、
以後同じセレクタを使用しても、継承されません。

2)htmlのheadタグ内での定義

これは、そのhtmlファイルの全てに設定する方法です。

<head>
 <style type="text/css">
p {color: black;}
span {color: blue; font-size: 10px; }
 </style>
... </head>

↑これで、このファイルの全てのp要素とspan要素に
属性を与えたことになります。

3)外部スタイルシートによる定義

この方法は、スタイルシートを別のファイル(cssファイル)で保存し、
html内で呼び出して適用する方法です。

コレによって、複数のページに同じスタイルシートを適用することができ、
また、htmlファイルが膨大にならなくてすみます。
リニューアルや変更もしやすいです。

<html>
 <head>
<link rel="stylesheet" type="text/css" href="xxx.css">
 </head>...

↑この様にして本文に適用します。
外部で保存するスタイルシートは
p {color:black;}・・・などのように、スタイルシート部分だけ記述します。
そして、cssファイルとして保存する、を選択します。

おわかり頂けたと思いますが、
exciteブログのスキン編集はこの3)の方法です。
本文に上記のような link rel とかはないですが、

スキン編集のhtml編集は、htmlファイル本文。
同じくcss編集は、外部スタイルシートファイル。

・・・であるということです。
css編集画面でスタイルシートを定義し、
html編集画面でそれを適用する。
というキホンは同じです。
[PR]
by trickycat | 2004-10-15 16:19 | ブログ試行錯誤 ▲page top▲