月や火星に土地を買ってみませんか?

我が家は飼い主が持っています♪昔のブログ我有電脳のコチラでも報告しています。

2006年11月23日

マダムふ〜のこそっと教えちゃお♪ CSS編

さて、昨夜は爆睡させていただいたマダムふ〜です。
おいおい…ブログの書き方教えたら早速、カキコしているし…顔(え〜ん)

夫よ…ついでに私は地底人でも宇宙人でもありませんからたらーっ(汗)残念!

(私は、とある友人と確かに地底人と宇宙人の交信をしていますけどね(^^ゞW笑)

ま、普段から私は…あんな感じなんです。
周りから見ていると、夫が物静か?(・・・細かいだけでしょ)で、私はハイテンションタイプ(楽しい事好き♪なのよ)らしいんで…顔(イヒヒ)

閑話休題。

このコーナーは松吉のことだけではなく、様々な事を書いていこうかと思っています。

そうこれは…マダムふ〜の趣味のコーナーですわーい(嬉しい顔)ハートたち(複数ハート)

マダムふ〜が昔…とある雑誌の応募でPCパソコンモニターとして、その利用記録のブログを書くということをしておりました。

その記録は…こちら『我有電脳

未だにそのいただいたPCを使ってブログ更新しております♪
この程度の知識でお役に立てることがあれば幸いですので…

今日は、ポレポレブログのぬーなーさんのご質問にお答えします!!

昨日のぬーなーさんのご質問は

このアセラの真っ白い両サイドバーのテンプレート、うちも同じの使ってるんですが、私も真ん中の記事の列の幅を広くしたいのですー。
テンプレートのところをイジるんだろうなっていうのは分かるんですが、どこ!?みたいな。
ちょろっと教えてくださいマセm(__)m


さて、アセラだけではなく、ブログを両サイドバー(3段組のレイアウト)にしていらっしゃる方は何人もいると思います☆
ブログの場合の形成はCSS(スタイルシート)というものを使い、Webの見た目を整えております。

(ココでつまずいてはいけません…よ。)

まずは、CSS(スタイルシート)とは、Web(HTMLで書かれたもの)のデザイン・レイアウトを指定する為のものと理解してください。

で、ブログの場合、ほとんどがこのCSSをいじって見た目を変えていくわけです。

という訳で…スタイルシートをいじって変更する場合、デザインが崩れる場合もありますので、全て自己責任でお願いいたしますm(__)m
(アセラの場合は…もしも、失敗して崩れてしまった時や元に戻したい時は、テンプレートから再度デザインを選んで『追加したテンプレートを今すぐ使用する』を選択して、追加保存してあげれば”全て!”元に戻ります。)


今回の場合、『3段組の真ん中の幅だけを広くしたい』という事なので…
(基本は、アセラご利用の場合でご説明します。他のブログサービスのご利用の方は…ご了承ください。でも、基本は一緒です♪)

1.まずは、【スタイルシート】を開きます。
アセラの場合は【デザイン】−【スタイルシート】−現在適用しているデザインの【タイトル】をクリック

2.CSSが書かれた編集フォームの中から次のような項目を見つけてください。

#container{ 〜 }


3.この#container{〜}中にあるwidthの数値を変更します。

例:
#container{

width:905px;



(ウチのブログと同じぐらいの幅にしたい場合は…このままで大丈夫ですよ〜)

この部分が、3段分の幅を決めています。

4.次に真ん中部分だけ幅を広くする為に、CSSが書かれた編集フォームの中から次のような項目を見つけてください。

#content {〜}

5.この#content{〜}中にあるwidthの数値を変更します。

例:
#content{

width:495px;



6.これでおしまい。
あとは、プレビュー機能で確認してから【保存】すればOK♪


まあ…私も素人なのでコレ位で。


さて、これだけで終わらせると…松吉を楽しみに来て頂いた方に失礼なので…

20061123_1.gif


マダムふ〜にも愛の手を…?!
人気blogランキングへにほんブログ村 猫ブログへ


CSS(スタイルシート)編集を覚えたい方にオススメ!

CSSコンパクトリファレンスCSSコンパクトリファレンス
磯野 康孝 蔵守 伸一


Amazonで詳しく見る
by G-Tools


【マダムふ〜のこそっと教えちゃお♪の最新記事】
ニックネーム マダムふ〜 at 13:23| Comment(10) | TrackBack(0) | マダムふ〜のこそっと教えちゃお♪ | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
ご無沙汰して申し訳ありませんー。

おぉ、これは勉強になります!
本も出てるのですね〜。
私はいろいろテンプレをみくらべながら適当にいぢってしまうほうです。。
しっかり勉強しなきゃですね(^_^;)

松吉くんも元気そうでなによりです!
Posted by まる at 2006年11月23日 14:39
いいシリーズが始まりましたね〜☆
私のような素人でも、やっているうちに
ある程度変更できるようになりますし
とにかくチャレンジ!ですよね♪
私はいじる前のデザインシートを
メモ帳にコピーしてから作業してますよー
こないだ変更したばかりですが
早くも次はどんなデザインにしようかなと画策しております(笑)
Posted by こめ at 2006年11月23日 19:21

「スタイルシート」の間違いですw
Posted by こめ at 2006年11月23日 19:22
※※いつもコメントありがとうございます※※

まるさん

まるさん流石!私もさほど詳しくないですが…PC系の本が好きで色々読み漁りました。
でもこれで少しは上達したかな?なんて思っても、ネット社会の動きは早いんでついていけないんです(>_<)

松吉は…寒くなってきてから、床暖から離れられなくなっているようです。

::::::::::::::::::::::::::::::::::::::::::::::

こめさん

ありがとうございます。しかし、猫ブログを外れてしまったような気もしつつ…ま、いいかぁ〜なんて(^_^;)
そうそう、とにかくチャレンジですよね☆
スタイルシートって、デザインシートとも言うので大丈夫ですよ♪
私も、ワードパッドを使ってコピペしてから編集しています!
FC2やはてなの場合は、本もいっぱい出ていて楽なんですが、アセラは、ページのソースからどの部分か…チェックしながらいじらないといけないので…難しいです(ToT)
Posted by マダムふ〜 at 2006年11月23日 23:13
せんせー!
出来ました顔(笑)
先生の教え方、すごい良く分かってサイコーでした。
ありがとうございましたっぴかぴか(新しい)
松吉くんも応援ありがとね黒ハート
これで横長の写真もバリバリ載せれます。

さて、ほかになんか分からんことなかったかな・・・?なんて♪
Posted by ぬーなー at 2006年11月24日 00:22
CSSがもっと分かればおもしろいだろうなあ
とよく思います
ほんの少ししか知らないまま一歩も進まず・・
本当は無地のテンプレートでやりたいと思ってます
タイトルのところに写真を載せるのは簡単ですか?
あ。。質問コーナーじゃなかった
すみません
Posted by うちこ母 at 2006年11月24日 00:48
おお、テンプレのいじり方ですね。
お詳しいのですね〜、すごいなぁ。
うちのテンプレは全部夫がいじってます(笑)。
私はかなりのパソコン音痴なものですから…。
Posted by みか@猫大好き at 2006年11月24日 13:35
※※いつもコメントありがとうございます※※

ぬーなーさん

よかったよかった♪で、先ほどぬーなーさんのページを訪れたら…タイトル画像が崩れてしまっていたので一応メールしておきました♪がんばって☆

*****************************************

うちこ母さん
CSSわかると色々変更できるようになるので楽しいですよ☆
私もまだまだ私もわからない事だらけですが、何とかここまでやってきました♪
是非チャレンジしてみてください☆
…では次回タイトルに写真を入れる方法ってことで(^v^)

*****************************************

みか@猫大好きさん

夫はまったくのパソコン音痴(>_<)…
はじめは触るのもこわいとか言っていたほどなんですよ(^_^;)

是非是非、みかさんもチャレンジしてみてください♪
出来てくると意外と面白いですよ〜
Posted by マダムふ〜 at 2006年11月24日 13:50
マダムふ〜さんPC詳しいのですねぇ。
マミ〜は駄目駄目ですぅ猫(泣)
マダムふ〜さんを見習って、ちょっとお勉強しなくちゃいけません。
Posted by ネロラオマミ〜 at 2006年11月24日 18:34
※※いつもコメントありがとうございます※※

アセラのスタッフブログでもこのやり方が出ていました!
…やはり崩れてしまう方もいらっしゃるようですのでご注意くださいm(__)m

http://staff.a-thera.jp/article/234165.html

********************************************

ネロラオマミーさん

そんなそんな〜何をおっしゃいますか、マミ〜さん♪HP立ち上げているではないですか!!
コチラのほうが勉強しなくてはいけません(>_<)

Posted by マダムふ〜 at 2006年11月25日 09:16
この記事へのトラックバックURL
http://a-thera.com/tb/589556
※ブログオーナーが承認したトラックバックのみ表示されます。
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック