| ページ全体 |
| セレクタ |
内容 |
例 |
| body |
ページ全体（背景、余白、文字など） |
背景色を黒（#000000）に変更します。
body {
background:#000000;
} |
| a |
ページ全体のリンク
未訪問、訪問済み、アクティブ時、マウスオーバー時をまとめて指定します。 |
アンダーラインを表示し、リンク色を赤（#ff0000）に変更します。
a {
text-decoration:underline;
color:#ff0000;
} |
| a:link |
ページ全体のリンク（未訪問） |
未訪問リンク色を赤（#ff0000）に変更します。
a:link {
color:#ff0000;
} |
| a:visited |
ページ全体のリンク（訪問済み） |
訪問済みリンク色を青（#0000ff）に変更します。
a:link {
color:#0000ff;
} |
| a:active |
ページ全体のリンク（アクティブ時） |
アクティブ時のリンク色を緑（#00ff00）に変更します。
a:link {
color:#00ff00;
} |
| a:hover |
ページ全体のリンク（マウスオーバー時） |
未訪問リンク色を黄（#ffff00）に変更します。
a:link {
color:#ffff00;
} |
| #container |
ヘッダー＋バナー＋サイド＋メイン（フッター以外） |
背景色をグレー（#eeeeee）に変更します。
#container {
width :770px;
background:#eeeeee;
} |
| ヘッダー |
| セレクタ |
内容 |
例 |
| #header |
ヘッダーリンク部分全体 |
|
| #memberMenu |
ログイン時に表示されるヘッダーリンク部分（●●さん 管理ページ 新規作成 自分のブログ） |
|
| #globalMenu |
常時表示されるヘッダーリンク部分（ブログトップ 使い方 Q&A） |
|
| .menuDecoration |
ログイン時に表示される個々のリンク |
|
| ブログタイトルバナー |
| セレクタ |
内容 |
例 |
| #banner |
ブログタイトルバナー全体 |
背景画像を挿入して高さを変更します。
#banner {
background:url(/_images/blog/任意のファイル名) no-repeat;
height:200px;
}
|
| #banner h1 |
ブログタイトル |
フォントサイズとフォント種類を変更します。
#banner h1 {
font-size:24px;
font-family:Arial,sans-serif;
} |
| #lead |
ブログ説明文 |
フォント色をオレンジ（#ff6600）に変更します。
#lead {
color:#ff6600;
} |
| コンテンツ |
| セレクタ |
内容 |
例 |
| #content |
サイドカラム＋メインカラム |
|
| #main |
メインカラム全体 |
|
| .archive-title |
上部ページングリンク全体 |
|
| .archive-bottom |
下部ページングリンク全体 |
|
| .archive-name |
ページングリンク |
|
| .previousLink |
「前へ」のリンク |
|
| .nextLink |
「次へ」のリンク |
|
| .archive-links |
「ブログトップへ」のリンク |
|
| 記事 |
| セレクタ |
内容 |
例 |
| .articles |
記事全体 |
黒（#000000）の枠線で囲みます。
.articles {
border:1px solid #000000;
overflow:hidden;
} |
| .articles-title |
記事タイトル |
背景色を紺（#003399）にして文字色を白（#ffffff）に変更します。
.articles-title {
background:#003399;
color:#ffffff;
} |
| .articles-body |
記事本文 |
文字色をグレー（#999999）に変更します。
.articles-body {
color:#999999;
} |
| .articles-top |
記事上の空divタグ（デザイン用） |
|
| .articles-bottom |
記事下の空divタグ（デザイン用） |
|
| .posted |
記事下部リンク部分 |
|
| .postDate |
記事下部リンクの日付表示 |
|
| エントリー |
| セレクタ |
内容 |
例 |
| .entry |
「nice!」、「コメント」、「コメントを書く」、「トラックバック」それぞれを囲むdivタグ
※各エントリーのCSSを一括指定できます。 |
|
| .etnry h4 |
「nice!」、「コメント」、「コメントを書く」、「トラックバック」それぞれをのタイトル
※各エントリータイトルのCSSを一括指定できます。 |
|
| #nice |
nice!全体 |
|
| .nice-buttom |
nice!のボタン |
|
| #comments |
コメント全体 |
|
| .each-comment |
各コメント |
|
| .comments-body |
各コメントのテキスト部分 |
|
| .caption |
コメントのユーザー名と日付部分 |
|
| #comment-write |
コメントを書く全体 |
|
| .comment-input |
コメント入力ボックス |
|
| .comment-button |
コメント送信ボタン |
|
| #trackback |
トラックバック全体 |
|
| .trackback-button |
簡単トラックバックボタン |
|
| サイド |
| セレクタ |
内容 |
例 |
| #side-a |
サイド左全体 |
|
| #side-b |
サイド右全体 |
|
| .sidebar |
各サイドバーを囲むdivタグ
※各サイドバーのCSSを一括指定できます。 |
黒（#000000）の枠線で囲みます。
.sidebar {
border:1px solid #000000;
} |
| .sidebar-title |
各サイドバータイトル
※各サイドバータイトルのCSSを一括指定できます。 |
黒（#000000）の下線を表示します。
.sidebar-title {
border-bottom:1px solid #000000;
} |
| .sidebar-body |
各サイドバーのボディ部分
※各サイドバーボディのCSSを一括指定できます。 |
文字色をグレー（#999999）に変更します。
.sidebar-body {
color:#999999;
} |
| .sidebar-end |
各サイドバー下部の空divタグ（デザイン用） |
|
| .new |
サイドの「NEW」マーク |
|
| #profile |
プロフィール全体 |
|
| .profile-img |
プロフィールイメージ |
|
| .profile-status |
プロフィールステータス部分 |
|
| .nice |
プロフィールステータス部分のnice!アイコン |
|
| .profileLink |
プロフィールステータス部分のプロフィールリンク |
|
| #calendar |
カレンダー全体 |
|
| .carendar-date |
カレンダー上部の年月部分 |
|
| .preMonth |
<<（前の月へ）リンク |
|
| .nextMonth |
>>（次の月へ）リンク |
|
| .thisMonth |
年月リンク |
|
| .sun |
日 |
|
| .mon |
月 |
|
| .tue |
火 |
|
| .web |
水 |
|
| .thu |
木 |
|
| .fri |
金 |
|
| .sat |
土 |
|
| .link |
カレンダーリンク部分 |
|
| #category |
カテゴリー全体 |
|
| #latestEntry |
最新記事一覧全体 |
|
| #latestComment |
最近のコメント全体 |
|
| #trackBack |
最近トラックバックされた記事全体 |
|
| #commentedEntry |
●●さんがコメントした記事全体 |
|
| #favoriteEntry |
●●さんがnice!と思った記事全体 |
|
| #favoredMember |
●●さんの記事をnice!と思った人全体 |
|
| #subscribedRSS |
読んでいるブログ（RSS）全体 |
|
| #search |
記事検索全体 |
|
| .search-tbox |
記事検索の入力ボックス |
|
| .search-button |
記事検索の検索ボタン |
|
| #rssRegist |
読者になる（RSSに登録）全体 |
|
| フッター |
| セレクタ |
内容 |
例 |
| #footer |
フッター全体 |
|
| .copyright |
「Powered by So-netブログ」テキスト |
|
| 2カラム左 |
| セレクタ |
内容 |
例 |
| .columnL |
レイアウトに2カラム左を指定したときのページ全体 |
|
| 2カラム右 |
| セレクタ |
内容 |
例 |
| .columnR |
レイアウトに2カラム右を指定したときのページ全体 |
|
| 3カラム |
| セレクタ |
内容 |
例 |
| .columnW |
レイアウトに3カラムを指定したときのページ全体 |
|
