スタイルシート – ページ 7

タグの中にスタイルシートを直接書かない１

スタイルシートの属性をタグから切り離し、外に書く。今回はスキンのヘッダに書いて、すべての記事に適用する方法を記します。

ファンブログのみなさま、こんにちは。お元気ですか。

私がアフィリエイトをはじめて今日で１０日目。皆さんのご協力があって、クリックで２６円もの収益を上げることが出来ました。このペースならきっと秋には予定通り新車が買えそうです！アフィリエイトって本当に儲かりますね！

さて、前回まではスタイルシートの属性をすべて、適用するタグそれぞれに書いてきました。
しかし、tableのような構造をあらわす時に、それでは不効率です。

同じことを何度も書かなくてはいけない。結果としてファイル容量が増える。これまでも文字数制限で何回も記事を分割することになりました。

書き間違いの恐れもあります。全部同じように見せるにはひとつも間違えずに同じ事を書かないといけません。

そして、なによりも大変なのは訂正する時です。
もし変更があれば該当箇所を全て、ひとつも残さずに修正しなければなりません。

ブログの中に作ったテーブル（表）の見栄えをスタイルシートで調整します。
テーブルのサイズ調整。テーブル内の文字レイアウト。テーブルの位置あわせ。
将来的には、外部スタイルシートと結びつける予定です。

ブログの中に作ったテーブル（表）の見栄えをスタイルシートで調整します。
テーブルの罫線に好きな色をつける。テーブルの背景に好きな色をつける。
将来的には、外部スタイルシートと結びつける予定です。

ブログの中に作ったテーブル（表）の見栄えをスタイルシートで調整します。
将来的には、外部スタイルシートと結びつける予定です。

今回はテーブルレイアウト篇です。

その前に。実はテーブルの位置がずっと下に行ってしまって直らずに困っていました。よそのサイトに答えが書いてありました。

恐らく送出されているHTMLソースを見れば、即気づいたはず。やっぱりソースは確認しないといけません。

しかし、preタグの時はどうするんだ？前回 preタグ使ってインデントを表現したんですが、しっかりとbrが入れられている。JavaScriptで消すしかないんかね？誰かご存知でしたらコメント欄に書いていただけませんか。

自己レスです。
ヘッダに以下のように書くことで(preタグの中の) br タグを無効に出来ました。

pre 内限定にしないと、ブログ中の全ての br が無効になりレイアウトが変わってしまうので注意。

枠の中に背景画像を設定するスタイルシートチップス。

今回のお題「枠の中の背景に画像を表示させたい！」

背景は風と樹と空とフリー素材さんのものを使わせていただきます。