ページナビの背景色・リンク文字色などの変更

★　ページナビの背景色・リンク文字色などの変更


注意：不要な行は消してください


①　記事内・記事一覧のページナビを変更

/* ------------------------------------------------------- */
/* 記事内・記事一覧のページナビを調整（前ページ・次ページ）*/
/* ------------------------------------------------------- */
.pagingNext,.pagingPrev,.pagingNext:visited,.pagingPrev:visited,
.pagingNext:link,.pagingPrev:link{
background-color:#ffffff !important;/* 背景色 */
color:#ff0000 !important;/* 文字色 */
font-size:14px;/* 文字の大きさ */
font-weight:normal;/* bold→太い文字 normal→普通 */
font-family:"HGP創英角ﾎﾟｯﾌﾟ体";/* 文字の種類 */
}
.pagingNext:hover,.pagingPrev:hover{/* カーソルを乗せたとき */
background-color:#000000 !important;/* 背景色 */
color:#ff00ff !important;/* 文字色 */
font-size:14px;/* 文字の大きさ */
font-weight:normal;/* bold→太い文字 normal→普通 */
font-family:"HGP創英角ﾎﾟｯﾌﾟ体";/* 文字の種類 */
}

②　記事一覧のページナビは別にしたい場合は、　①の後に追記

/* ------------------------------------------------------- */
/* 記事一覧のページナビを調整（前ページ・次ページ）　　　　*/
/* ------------------------------------------------------- */
.listContentsArea .pagingNext,.listContentsArea .pagingPrev,
.listContentsArea .pagingNext:visited,.listContentsArea .pagingPrev:visited,
.listContentsArea .pagingNext:link,.listContentsArea .pagingPrev:link{
background-color:#000000 !important;/* 背景色 */
color:#ff00ff !important;/* 文字色 */
font-size:14px;/* 文字の大きさ */
font-weight:normal;/* bold→太い文字 normal→普通 */
font-family:"HGP創英角ﾎﾟｯﾌﾟ体";/* 文字の種類 */
}
.listContentsArea .pagingNext:hover,.listContentsArea .pagingPrev:hover{/* カーソルを乗せたとき */
background-color:#ffffff !important;/* 背景色 */
color:#ff0000 !important;/* 文字色 */
font-size:14px;/* 文字の大きさ */
font-weight:normal;/* bold→太い文字 normal→普通 */
font-family:"HGP創英角ﾎﾟｯﾌﾟ体";/* 文字の種類 */
}

③　記事をスクロールした場合や記事幅を変えた場合は、
　　下記ＣＳＳで前ページや次ページの位置を調整してください。

/* ------------------------------------------------------------- */
/* 記事内・記事一覧のページナビを調整（記事をスクロールした場合）*/
/* ------------------------------------------------------------- */
.pagingArea{ /* 記事ページナビ */
width:97%; /* 幅 */
}
.pagingNext {/* 次ページ */
left:220px; /* 位置 */
}
.pagingPrev {/* 前ページ */
right:220px; /* 位置 */
}

④　単純にページナビの文字色を変えたい場合

/* ページナビの色 */
.pagingArea .pagingPrev,/* 前ページ */
.pagingArea .pagingList,/* 記事一覧 */
.pagingArea .pagingNext{/* 次ページ */
color:#ff00ff;/* 文字色 */
}
/* ページナビの色 カーソルを乗せたとき */
.pagingArea .pagingPrev:hover,/* 前ページ */
.pagingArea .pagingList:hover,/* 記事一覧 */
.pagingArea .pagingNext:hover{/* 次ページ */
color:#00ff00;/* 文字色 */
text-decoration:none;/* アンダーラインなし */
}