3219259 ランダム
 ホーム | 日記 | プロフィール 【フォローする】 【ログイン】

【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! --/--
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x
2007/08/19
XML
カテゴリ:ホームページ作成

久々にトップフリーページとラジオ周波数一覧を書き直してみたのですが、レイアウトを微妙に変えてしまったため、前のとちょっと趣が変わってしまいました。と、いっても、中身はほぼ同じなので、見比べないと違いはわからないのですが。

楽天ブログをやっている人で、スタイルシートで派手にレイアウトされている人はほとんど見たことないので、やってみようという人がほぼいないのかもしれませんが、注意点がいくつかあります。
それは、タグにスタイルが定義されている(例えば、.h3 {width:97%}とか)があるため、ブラウザのデフォルトだと思ってスタイルを定義しないと、ブログ上にアップしたときに、予想外な表示になります。

#content-center h3 {
background-color:#33CCFF;
border:1px solid #FFFFFF;
color:#00455F;
font-size:10pt;
font-weight:normal;margin:6px 0px 14px;
padding:4px;
width:97%;
}
#content-center h4 {
background-color:#FFFFFF;
border-bottom:1px dashed #CCCCCC;
color:#005D7C;
font-size:10pt;
font-weight:lighter;
line-height:133%;
margin:0px;
padding:5px 5px 3px;
text-align:left;width:97%;
}

楽天ブログの場合、デザインテーマ(一般的にはスキンとかいう場合がある)やレイアウトが変更できるため、定義されるスタイルシートは変わるかもしれませんが、少なくともこのブログのテーマとレイアウトの場合、トップ自由欄のh3とh4は右のようなの定義となっています。
ブログ管理で設定したテーマとレイアウトをもとにスタイルシートが設定されているので、なんだかの定義がされているのは当然ですが、自前でスタイルを設定しようとする場合、既に設定されているスタイルを変えなくてはならない場合があるということです。
右の例の場合だと、状況によってwidth、margin、paddingなどを設定したほうがよかったりするわけです。
まぁ、width:97%というのは、paddingとかを設定しているためこうなっているようですが、外にdivでwidthを設定しておいて、中身にmargin、paddingを設定してwidthは設定しない(すなわちauto)するのが個人的には好みですが…。ちなみにこのようなwidth設定がだめぽとかいっている訳ではないのであしからずw。


ブログランキング ドット ネット

ランクバーナー





お気に入りの記事を「いいね!」で応援しよう

最終更新日  2007/08/19 11:18:48 PM
コメント(1) | コメントを書く


PR

カレンダー

バックナンバー

2024/06
2024/05
2024/04
2024/03
2024/02

カテゴリ

ニューストピックス

プロフィール

finky

finky


© Rakuten Group, Inc.