2004年11月10日

記事に枠線をつける+α

こんばんは。
前回と見た目の雰囲気が変わっていますが、色を変えたせいであって新しいことはあまりしていません(^^;

今回は記事タイトルの文字の色の変更(+α部分)と、記事に枠をつける作業をしたいと思います。

1.記事タイトルの文字の色の変更
 「H3 {}」の中の「color」を前2回と同じ要領で変更するだけです。これで文字の色が変わります。

2.記事部分に枠線をつける
 いじるのは「#content {}」についてなんですが、今回はちょっと勝手が違います。中に書き足すのではなく、新しく「#content {}」を作ってその中に書きます。こうしないと前回指定した記事の大きさの割合が無効になってしまうようです。
 こんなかんじです↓

  #content {
  background:#ffffcc;
  margin-bottom:30px;
  margin-top:50px;
  margin-left:50px;
  float:left;
  width:60%
  }

  #content {
  border:2px solid #996600;
  }


 細字がもともと書かれている分で、それとは別に太字の部分を書き足します。
 「border:好きな太さ(ピクセル)px solid #好きな色のコード」にしてください。
 すると

変更2−4・色を変えただけです

 これ(クリックで拡大)が

変更3・記事タイトルの色を変更して記事に枠線をつけました

 こう(クリックで拡大)なります。枠線がつきました。
 大きさが変わっているのは気にしないでください。


 今回はここまでです。おつきあいありがとうございましたm(_ _)m


タグ:CSS
posted by 四葉屋 at 20:12| Comment(4) | TrackBack(1) | CSSいじり | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
トラバさせていただきました。初心者なもので、不都合とかありましたらおっしゃってくださいね。また遊びに来させていただきます。
Posted by ひろっち at 2005年06月19日 00:08
ひろっちさんはじめまして!
コメント&トラバありがとうございます(^0^)
こちらからもトラバ返しさせていただきました。
またいらしてくださいね。
Posted by 四葉屋 at 2005年06月19日 20:35
はじめまして。
お聞きしたいことがあるのですが、カテゴリのひとつひとつに枠線をつけたいのですが、やりかたを教えていただけませんでしょうか。
お忙しいところ申し訳ありませんが、よろしくおねがいいたします。
Posted by tomo at 2005年11月19日 15:51
>tomoさん
はじめまして!コメントありがとうございます。
お返事大分遅くなってしまって本当にすみません。

カテゴリのひとつひとつに枠線を、とのことですが囲む範囲が私の想像で合っているかちょっと自身がないのでそれぞれの場合について書いてみようと思います。(長くなります、ごめんなさい)

1.全体に枠の場合。
.side-title{}内にborder(top、right、left)を、side{}内にborder(right、left、bottom)を入れてください。borderはそれぞれ「border-○○:〜」(○○はtopとかrightとか。〜はpxや枠線の種類など)という風に指定してください。
2.カテゴリ名とカテゴリそれぞれに枠の場合。
これは1.よりも簡単。
.side-title{}、side{}内にそれぞれ「border:〜」でお好みの指定を入れてください。ただし上下左右で見た目を変えたい場合は1.と同じようにtopやrightで指定が必要です。
3.全体を囲みカテゴリ名とカテゴリの間にも線を入れる。
この場合は1.に加えてside-title{}内に「border-bottom:〜」を入れるか、side{}内に「border-top:〜」を入れてください。
※1.や3.の場合はside-titleとside間に隙間ができないようにmargin、paddingを調節する必要があります。side-title、side内で調節してもできない場合はlinksやlinks-leftがあやしかったりするかもしれません。

この方法で枠線がつけられると思います。なんだかややこしい書き方になってしまってすみません(汗)もしわからないところがあったらお手数ですがコメント等から教えてくだされば幸いです。
Posted by 四葉屋 at 2005年12月19日 01:16
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

この記事へのトラックバックURL
http://blog.seesaa.jp/tb/1006959

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

「枠線をつける・変える」カスタマイズ講座(その2)
Excerpt: 今日もCSSを少しいじってみます。 枠線がなかったので・・・。枠線をつけました! 記事部分や、サイドバーなどにもこの方法は使えます。試してみてね━(。・ω・)ノ 是非、私も僕もと言う方は→ まずは..
Weblog: ひろっちのぽっか日記VSアフィリエイト
Tracked: 2005-06-19 00:10
×

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