ブログタイトルの設定を変える―文字・配置

【ブログタイトルの設定】
＜ブログタイトルの文字の大きさを変える＞ブログタイトルの文字の大きさを変えるには
/*-----Common-----*/内の

#banner h1{
margin:0;
font-family: Helvetica,Arial,sans-serif;
font-size: 22px;
padding-left: 18px;
padding-top: 58px;
}

赤字部分を変更します。
文字の大きさの変更については、
記事「ブログ(body要素)の背景・文字の設定を変える」の
『文字の大きさを変える』を
ご覧ください。(クリックで移動します)


＜ブログタイトルのフォントの種類を変える＞
ブログタイトルのフォントの種類を変えるには

#banner h1{
margin:0;
font-family: Helvetica,Arial,sans-serif;
font-size: 22px;
padding-left: 18px;
padding-top: 58px;
}

赤字の部分を変更してください。
赤字部分を変更します。
フォントの種類の変更については、
記事「ブログ(body要素)の背景・文字の設定を変える」の
『フォントの種類を変える』を
ご覧ください。(クリックで移動します)


＜ブログタイトルを斜体にする＞
ブログタイトルを斜体に変えるには

#banner h1{
margin:0;
font-family: Helvetica,Arial,sans-serif;
font-size: 22px;
font-style="italic";
padding-left: 18px;
padding-top: 58px;
}

赤字の部分を追加してください。


＜ブログタイトルの文字の太さを変える＞
ブログタイトルの文字の太さを変えるには

#banner h1{
margin:0;
font-family: Helvetica,Arial,sans-serif;
font-size: 22px;
font-weight:★;
padding-left: 18px;
padding-top: 58px;
}

赤字の部分を追加してください。
★の部分の入る値については、
記事「ブログ(body要素)の背景・文字の設定を変える」の
『フォントの太さを変える』を
ご覧ください。(クリックで移動します)


【ブログタイトルの位置を整える】
＜ブログタイトルの位置を変える＞ブログタイトルの基本位置は
前記事、「バナーの設定を変える」でご説明しておりますが
#container{
・
・
}
内のtext-align:★；（★にはleft right centerのどれか)にて
設定されております。
あとはtext-alignにて決めた位置からの
paddingでの上下左右への調整です。


【その他】
＜ちょっとお遊び＞
おまけで、ブログタイトルにちょっとした細工を
ご紹介します。

「世界（ザ・ワールド）」時よ止まれ

何も飾り気のない、ブログタイトルに
枠線ドットを使ってみました。
さうがに4辺を囲むとかっこ悪いので
下辺だけでいいと思います。
やりかたは
#banner h1{
margin:0;
font-family: Helvetica,Arial,sans-serif;
font-size: 22px;
border-bottom:dotted 好きな色 線の太さ;
width:お好みの幅;
padding-left: 18px;
padding-top: 58px;
}
です。
その他の枠線も使用可能ですので
いろいろお試し下さい。
慣れるとサブタイトルであったり
記事のタイトルにも応用できると思います。

ただし注意として、
枠線がブログタイトルよりも短いと
ブログタイトルが改行されます。

それと{ }内には全角不可です。

タグ：カスタマイズ ブログ ブログタイトル CSS so-net