★ 記事タイトルの調整
◆ 記事タイトルの枠
① 枠を消す
/* ------------------------------------------------------- */
/* 記事タイトルの枠を消す */
/* ------------------------------------------------------- */
.skinArticleHeader{
border:none;
}
② 枠をつける
/* ------------------------------------------------------- */
/* 記事タイトルの枠を設定 */
/* ------------------------------------------------------- */
.skinArticleHeader{
border-top :5px solid #ff00ff;/* 上 */
border-right :5px solid #ffff00;/* 右 */
border-bottom:5px solid #0000ff;/* 下 */
border-left :5px solid #00ffff;/* 左 */
}
◆ 記事タイトルの背景色
① 背景色
/* ------------------------------------------------------- */
/* 記事タイトルの背景色 */
/* ------------------------------------------------------- */
.skinArticleHeader {
background-color:#ffff00;
}
◆ 記事タイトルの文字・画像の中央寄せ
① 文字・画像の中央寄
/* ------------------------------------------------------- */
/* 記事タイトルの文字・画像を中央寄せ */
/* ------------------------------------------------------- */
.skinArticleHeader {
text-align:center;/* center→中央 left→左 right→右 */
}
◆ 記事タイトルの文字の色・大きさ・太さ
① 文字・画像の文字の色・大きさ・太さ(リンク色)
/* ------------------------------------------------------- */
/* 記事タイトルの文字の色・大きさ・太さ */
/* ------------------------------------------------------- */
.skinArticleHeader h1,.skinArticleHeader h1 a{
color:#ff00ff !important;/* 色 */
font-size:28px !important;/* 大きさ */
font-weight:normal !important;/* bold→太い文字 normal→普通 */
}
◆ 記事タイトルの背景画像設定
① 画像を繰り返しない
/* ------------------------------------------------------- */
/* 記事タイトルの背景画像設定 */
/* ------------------------------------------------------- */
.skinArticleHeader{
background-image:url(画像のURL);
background-repeat:no-repeat;/* 繰り返ししない */
background-position:left top;/* 位置 */
}
② 画像を繰り返しする
/* ------------------------------------------------------- */
/* 記事タイトルの背景画像設定 */
/* ------------------------------------------------------- */
.skinArticleHeader {
background-image:url(画像のURL);
background-repeat:repeat;/* 繰り返しする */
background-position:left top;/* 位置 */
}
◆ 記事タイトルにワンポイント画像
① 新しい記事にマーク(叫びの例)
/* ----------------------------------------------------- */
/* ■ 新しい記事にマーク 叫び */
/* ----------------------------------------------------- */
.newArticle .skinArticleHeader{
padding-left:25px;
background-image:url(http://stat.ameba.jp/blog/ucs/img/char/char2/254.gif) !important;
background-repeat : no-repeat;
background-position:left 30%;
border:none;
}
② 他の記事にマーク(イヒヒの例)
/* ----------------------------------------------------- */
/* ■ 他の記事にマーク イヒヒ */
/* ----------------------------------------------------- */
.skinArticleHeader{
padding-left:25px;
background-image:url(http://stat.ameba.jp/blog/ucs/img/char/char2/193.gif);
background-repeat : no-repeat;
background-position:left 30%;
border:none;
}
★ 追記
◆ 記事タイトル右にもワンポイント画像を配置
① 記事タイトル右にワンポイント画像
/* ------------------------------------------------------- */
/* 記事タイトル右にワンポイント画像 */
/* ------------------------------------------------------- */
.skinArticleHeader2 {
background-image: url(画像のURL);
background-position: right 30%;
background-repeat: no-repeat;
border:none;
}
◆ 記事タイトルの削除
① 削除する
/* ------------------------------------------------------- */
/* 記事タイトルの削除 */
/* ------------------------------------------------------- */
.skinArticleHeader{
display:none;
}