So-net無料ブログ作成
<登場人物>
kyara1.png
横浜べいすた。
最近ブログを始めた。
オリジナリティあふれるブログに憧れる。
kyara2.png
空条Q太郎。
スタンド使い?
星つながりで、ベイスタの面倒をみる。

CSSを分類してみよう

kyara1.png:「Q太郎さん!! 録画に必要なものは
分かったんですけど、肝心の録画の仕方がわかりません・・・」

kyara2.png:「前の記事のリンクを見た前提で話すぞ。
テンプレート内
-----{


}
の{ }内に指定したい、『フォント要素』『背景要素』『ボーダー要素』を記述する。
記述方法は 要素:値だ。
要素とはフォントであれば、font-size,font-weight,font-family,font-style,colorであり、
背景ならば、background-color,background-image
ボーダーなら border-styleなどだな」

kyara1.png:「なるほどなるほど。
でも自分で勝手に{ }を作って記述していいんですか?」

kyara2.png:「ふっ、べいすたにしては鋭い指摘だな。
既に気づいているとは思うが
----{


}の----部分が番組名だ。
つまり、この----という番組を
【要素:値】で予約しますってことだ。

kyara1.png;「そうは行っても、その番組名が理解できないですよ~」

kyara2.png:「そう言うと思ったぜ。
これもuryyyyyがどこがで別に説明していたから
そこにリンクを張る。
記事『テンプレートの中のCSSを見てみよう』の
図と照らし合わせながらみると効果的・・・かも。
①/*-----Common-----*/
②/*-----Content-----*/
③/*-----Entry-----*/
④/*-----Side-----*/
⑤/*-----Footer-----*/
どれがどこに対応しているかが分かれば
あとは値を入れて行くだけだ」



CSSの要素を見てみよう

kyara2.png:「べいすた、一つ尋ねるが番組を録画するとき必要なものは何だ?」

kyara1.png:「必要なものですかぁ?何ですか?」

kyara2.png:「質問を質問で返すなあーっ!!
疑問文には疑問文で答えろと学校で教えているのか?」

kyara1.png:「すっ、すみません・・・」

kyara2.png:「やれやれだぜ。
いいか、まず時間。次に曜日、そしてチャンネルだ。
それをCSSに置き換えると、 『フォント』・『背景』・『ボーダー』となる。
まぁ3つの要素ということが言いたいだけだ」

kyara1.png:「でQ太郎さん、その『フォント』・『背景』・『ボーダー』って何ですか?」

kyara2.png:「『フォント』は文字に関わるものだ。
字体・文字の太さ・文字の大きさ・文字の色・文字の種類だな。
厳密には行間や位置の指定、テキストの装飾まで含まれるがな」

kyara1.png:「では次、背景をお願いいします」

kyara2.png:「背景とはbackgroundそのままだ。
この記事の下はピンクの+が連なっているのが分かるか?」

kyara1.png:「それは見れば分かりますよ」

kyara2.png:「では、今度は記事のタイトルの部分がオレンジ色になっているのが分かるか?」

kyara1.png:「だからそのぐらい、いくらおいらでも分かりますよ」

kyara2.png:「つまり、背景とは記事やタイトルなどの下地に
適用している、色や画像のことだ」

kyara1.png:「えぇぇぇー!!そのままじゃないですか。
じゃぁ次ボーダーについて教えて下さいよ~」

kyara2.png:「ボーダー、それは枠線のことだ」

kyara1.png:「枠線・・まさかって感じだがグッと来たぜ」

kyara2.png:「おい、ふざけているのか。
いずれにしろ『フォント』・『背景』・『ボーダー』とも
uryyyyyyのやつが別のサイトで説明していたから
そこにリンクを張るので見ておくんだな、べいすた」

kyara1.png:「わかりました。ではURLを」

kyara2.png:「『フォント』
『背景1』
『背景2』
『ボーダー1』
『ボーダー2』
だな」

kyara1.png:「さすがQ太郎さん、そこに痺れる!、憧れるゥ!」

kyara2.png:「・・・・・・」

to be continued

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。

×

この広告は1年以上新しい記事の更新がないブログに表示されております。