メールで、「タイトルの部分を変更したい」という質問が寄せられたので
ここで説明いたします。
(メールだと表現しづらい部分がありますので。
前回のスタイルシート講座では
「カーソルを+に変える方法」を説明しましたが、
今回はブログの一番上の部分(タイトル部分)を四角の線で囲ったものに変えます。
前回と同じですが、まず始めに、
メニューのスタイルシートをクリック
↓
カスタマイズのスタイル編集ボタンをクリック
↓
そうすると、目がチカチカするような暗号が出てきます。
(まぁ、これがスタイルシートと呼ばれる一種の言語なんですが。
↓
その中から、「#Header」という文字を探してください。
(これを見つけられなければ,先には進めませんw
(見つけるための裏技として、キーボードのCtrlとFを押して探してもらってもOK
↓
そしたら、こんな風になってるはずです。
#Header
{
padding:20px; margin-top: 5px;
background-image: url('/styles/images/headerpink.jpg');
margin-bottom: 0px;
width: 750px;
background-repeat: no-repeat;
}
#Header a
{
color: #fff;
text-decoration: none;
}
#Header a:link
{
color: #fff;
text-decoration: none;
}
#Header a:visited
{
text-decoration: none;
}
#Header a:active
{
}
#Header a:hover
{
color: #fff;
text-decoration: underline;
}
この部分を切り取って、
#Header
{
width: 750px;
height:120px;
margin-top:5px;
margin-bottom:10px;
background: #FFE3ED;
border: #FFA3C1 1px solid;
}
#Header a
{
color: #FFA3C1;
text-decoration: none;
}
#Header a:link
{
color: #FFA3C1;
text-decoration: none;
}
#Header a:visited
{
text-decoration: none;
}
#Header a:active
{
}
#Header a:hover
{
color: #FFA3C1;
text-decoration: underline;
}
と、置き換えてください。
あとは下にある保存するボタンを押して完成♪
(今回はピンク色ベースにした場合で配色を考えました。
線の色、背景の色を変えたい場合には
#FFE3EDや
#FFA3C1の部分を変えてみてください。
これはカラーコードといって、黒なら
#000000、白なら
#ffffffです。
もっと他の色に変えたい場合は、ここ↓を参照してください。
http://www.tagindex.com/color/color_name.html
また、四角の高さを変えたい場合には
120の値を変えてみてください。
ここがよくわからないなどの質問等ございましたら、レスorメールください。
Posted at 2006/05/17 18:38:11 | |
トラックバック(0) |
スタイルシート関係 | 日記