アサブロをセンタリングするには(長文) ― 2007年01月14日 23時51分16秒
私は,このブログを初めてからスタイルシート(CSS)なる言葉を知りました。そんな初心者が書こうってんですから,これから記述することはトンチンカンであるのは自明の理です。
それを覚悟して,読んで下さい。でも,きっと同じ悩みを持って,同じフロアーにいる方もいるだろう…難しいから誰にも聞けないし…そんな思いと,自分が忘れないために残しておきます。
アサブロのテンプレートでは,どれを選んでもブログ全体がセンタリングされません。左に寄ってしまいます。これは,ブラウザを最大にした場合に見栄えが悪いし,何か変な感じがします。では,どうすればいいのか。
それは,スタイルシートを編集するのです。
スタイルシートは,このブログを執筆する際に必ず目にする「アサブロ管理画面」の左下にあります。「スタイルシート選択」では,テンプレートを切り替えるだけになってしまいますから,その下の「スタイルシート編集」をします。
そうすると,ちょっとホームページをかじった人なら,ソースっぽいものが記述されているなぁとお感じになるでしょう。それが,CSSらしいです。それが,このブログの見栄えを決定している根幹で,ユーザーが唯一いじれるセクションとなります。
そこで,そのソースを初めから最後までドラッグして選択し,ご自分のメモ帳ソフト(エディター)に貼り付けましょう。そして,適当に名前をつけて保存してください。(asablo_org.cssなど)
さて,次に私のような初心者はどうすればいいのか。そうですね,アサブロですでにセンタリングを実施なさっている方のページで勉強するわけです。(ぱくりか!)すると,アサブロの開発者の方?がページを公開さなっていますが,見事に私の望む見栄えになっているんですね,これが。
参考[ http://tkusano.asablo.jp/blog/ ]
ということで,何故同じアサブロでこの方のページは中央に寄せられるのか…この方が使っているCSSをちょっとのぞいてみることにしました。すると,自分の使っているものと基本的に同じなのですが,微妙にちょこちょことちがう箇所があるではないですか!きっと,この違いにセンタリングさせる記述があるはずだと考えた浅はかな私は,使用する画像のリンクなどは替えつつ,自分のCSSに適用してみました。そうしたところ,意味はわかりませんがセンタリングできたというわけです(こんなんでいいのか,ほんとに)個人的には,#containerと書かれたあたりが…くさいと感じてます。
かなり長くなってきましたが,ここに私のページで使っているCSSを載せておきます。参考にされまして,色々いじってみてください。おかしくなっても,みなさんには,先ほどとったバックアップのCSSがあるわけですから,いつでも元に戻せます。それでもだめなら,スタイルシートを選択しなおすという荒技もあります。
専門的な方には,きっと抱腹絶倒の日記でしたが,逆さまにしても何もでないくらい一生懸命やりました。全国に同じことで今も試行錯誤なさっている方がいて,少しでも助けになれば無上の喜びです。
ご静聴,ありがとうございました(笑)
追記
私のCSSの末尾に,みなれない記述があると思います。これは,画像の上にマウスを置くとその画像が拡大されてポップアップするということをさせる方法があるということを知り,試しに載せてみたものです。私は,仕組みを知りません。その記述にあるURLの方が仕組みを知っています(涙)
それを覚悟して,読んで下さい。でも,きっと同じ悩みを持って,同じフロアーにいる方もいるだろう…難しいから誰にも聞けないし…そんな思いと,自分が忘れないために残しておきます。
アサブロのテンプレートでは,どれを選んでもブログ全体がセンタリングされません。左に寄ってしまいます。これは,ブラウザを最大にした場合に見栄えが悪いし,何か変な感じがします。では,どうすればいいのか。
それは,スタイルシートを編集するのです。
スタイルシートは,このブログを執筆する際に必ず目にする「アサブロ管理画面」の左下にあります。「スタイルシート選択」では,テンプレートを切り替えるだけになってしまいますから,その下の「スタイルシート編集」をします。
そうすると,ちょっとホームページをかじった人なら,ソースっぽいものが記述されているなぁとお感じになるでしょう。それが,CSSらしいです。それが,このブログの見栄えを決定している根幹で,ユーザーが唯一いじれるセクションとなります。
そこで,そのソースを初めから最後までドラッグして選択し,ご自分のメモ帳ソフト(エディター)に貼り付けましょう。そして,適当に名前をつけて保存してください。(asablo_org.cssなど)
さて,次に私のような初心者はどうすればいいのか。そうですね,アサブロですでにセンタリングを実施なさっている方のページで勉強するわけです。(ぱくりか!)すると,アサブロの開発者の方?がページを公開さなっていますが,見事に私の望む見栄えになっているんですね,これが。
参考[ http://tkusano.asablo.jp/blog/ ]
ということで,何故同じアサブロでこの方のページは中央に寄せられるのか…この方が使っているCSSをちょっとのぞいてみることにしました。すると,自分の使っているものと基本的に同じなのですが,微妙にちょこちょことちがう箇所があるではないですか!きっと,この違いにセンタリングさせる記述があるはずだと考えた浅はかな私は,使用する画像のリンクなどは替えつつ,自分のCSSに適用してみました。そうしたところ,意味はわかりませんがセンタリングできたというわけです(こんなんでいいのか,ほんとに)個人的には,#containerと書かれたあたりが…くさいと感じてます。
かなり長くなってきましたが,ここに私のページで使っているCSSを載せておきます。参考にされまして,色々いじってみてください。おかしくなっても,みなさんには,先ほどとったバックアップのCSSがあるわけですから,いつでも元に戻せます。それでもだめなら,スタイルシートを選択しなおすという荒技もあります。
専門的な方には,きっと抱腹絶倒の日記でしたが,逆さまにしても何もでないくらい一生懸命やりました。全国に同じことで今も試行錯誤なさっている方がいて,少しでも助けになれば無上の喜びです。
ご静聴,ありがとうございました(笑)
追記
私のCSSの末尾に,みなれない記述があると思います。これは,画像の上にマウスを置くとその画像が拡大されてポップアップするということをさせる方法があるということを知り,試しに載せてみたものです。私は,仕組みを知りません。その記述にあるURLの方が仕組みを知っています(涙)

