« 第32回:自分専用のfavicon(ファビコン)を付けてみよう | トップページ | ブログ便利ツール:ブログ専用検索サイト »

2006/06/18

基本5:カスタム・テンプレート用CSSの主な要素名一覧

カスタム・テンプレートを作成したときに生成される主な要素(セレクター)名を一覧にしてみました。
CSSを記述する際の参考にして下さい。

【注意】

     
  • 表示してある項目によって、セレクターの種類・数は変動します。
      下記に記載したのは、あくまで私が作ったカスタム・   テンプレート上で確認できたものであり全てのセレクターを網羅しているわけではありません。  
  • 「適用箇所」については、適用が確認出来たもののみ記載しました。
      記入がないものは、セレクターとして存在するがどこに適用されるか判断出来なかったものです。
      今後確認しましたら随時追加・修正していきます。  
  • セレクターの記載には注意を払ったつもりですが、記入ミスがあるかもしれません。
      ミス・モレを発見しましたら管理人までご一報頂ければ幸いです。  
  • 各セレクターに対してCSSを適用する方法については、CSSの解説サイトなどを参考にして下さい。
      【参考サイト】
      「TAG index」   様
        「超初心者のためのスタイルシート講座」

A / B / C / D / E / F / H / I / L / M / P / R / S / T / U

索引

要素(セレクター)名

適用箇所
A a リンク全体
  a:link 通常のリンク
  a:visited 訪問済みリンク
  a:active 接続中リンク
  a.parmalink 記事フッターの「固定リンク」
  #archive-category サイドバーの「カテゴリー」
  #archive-datebased サイドバーの「バックナンバー」
B body ブログ全体の背景
  #banner タイトル部分
  #banner-img タイトル画像
  #banner a タイトル文字のリンク
  #banner h1 タイトル文字
  #banner h2 サブタイトル文字
C #container 記事表示欄+サイドバーの背景
  #center  
  .content 記事欄全体
  .content p 記事内の段落
  .content blockquote 記事内の引用
  .content li 記事内のリスト
  .content h2 記事の日付
  .content h3 記事のタイトル
  .content p.posted 記事のフッター全体
  #calendar カレンダー全体
  #calendar table カレンダーの曜日・ 日付部分
  #calendar caption カレンダーのタイトル
  #calendar th カレンダーの曜日
  #calendar td カレンダーの日付
  #comment-data コメント入力欄 ( 「内容」以外)
  .content-center  
  .comment 記事のフッターのコメント部分
  .content-bottom  
D .date-footer  
E .entry-center  
  .entry 個別の記事部分 (タイトルからフッターまで)
  .entry-body-center 記事欄の一行目
  .entry-body 個別の記事部分 (本文のみ)
  .entry-body-text  
  .entry-body-bottom 記事のフッター部分
  .entry-bottom  
F #footer  
H h1 タイ トル部分
  h2 サブ タイトル、サイドバーのリストタイトル 記事の日付
  h3 記事 のタイトル
I .img-full 挿入した画像の最大状態
  .img-thumbnail 挿入した画像の縮小状態
  .image-thumbnail img 「マイフォト」のサムネイル
  .img-link  
L #left 左サイドバー全体
  .link-note サイドバーの「プロフィール」、「マイニ フティ」、「RSS」、 「マイリスト」
M #main-center  
  #main  
  .module-typelist module list  
  .module-header h2  
  .module-center  
  .module-content module-body  
  .module-list-item li サイドバーのリスト内の項目
  .module-bottom  
  .module-content module-body typelist-plain  
  .module-syndicate module  
  .module-content link-note  
  .module-calendar module  
  .module-categories module  
  .module-archives module  
  .module-content  
  .module-recent-comments module  
  .module-recent-trackbacks module  
  .module-nifty-rss-reader module  
  #main-bottom  
P .photo  
  #powered  
  #pagebody  
  #pagebody-inner  
  .post-footers 記事のフッターの日付
R #right 右サイドバー全体
  #recent-entries サイドバーの「最近の記事」
  #recent-comment サイドバーの「最近のコメント」
  #recent-trackback サイドバーの「最近のトラックバック」
S .sidebar サイドバー全体
  .sidebar h2 サイドバーのリストタイトル
  .sidebar ul サイドバーのリスト項目(番号付き)
  .sidebar li サイドバーのリスト項目
  .sidebar img サイドバーの画像
  .sidebar-center  
  .sidebar-bottom  
  .separator 記事のフッター項目を区切る縦線
T textarea#comment-text コメント入力欄
  .typelist-note  
  .trackback 記事のフッターの「トラックバック」
U ul.module-list サイドバーのリスト項目全体

*この記事にコメントを書く*


|

« 第32回:自分専用のfavicon(ファビコン)を付けてみよう | トップページ | ブログ便利ツール:ブログ専用検索サイト »

基本」カテゴリの記事

カスタマイズ」カテゴリの記事

ウェブログ・ココログ関連」カテゴリの記事

コメント

ココログフリーを使い始めて1ヶ月。あるときふとカテゴリーをみると、リンクが切れて、カテゴリーを選んでも使えない状態となっていることに気づきました。
http://satoumi.cocolog-nifty.com/blog/
ですが、いろいろなものを調べても、カテゴリーのこのリンクを復活させる方法が載っておらずほとほと困っております。
カテゴリー機能を使えるようにするにはどうしたらよいのか教えていただけませんでしょうか。

投稿: 中島 満 | 2006/11/17 16:31

■中島 満さん
こんにちは。コメントありがとうございます。

ご質問の件ですが、設定が何かの拍子に変わってしまったようですね。
カテゴリーのリンクを戻すには、
管理ページトップ>ブログ>設定>バックナンバー設定
と進んで、その中の「カテゴリー別」の項目にチェックを入れます。(現在は外れていると思います)
その設定を保存した後、「サイトに反映」して下さい。

これでカテゴリーにリンクが張られるはずです。
試してみて下さい。

投稿: tako→中島 満さん | 2006/11/17 22:43

こんにちはtako様。はじめまして。
最近、CSSをおぼえはじめ、コツコツと
ブログデザインをカスタマイズしております。

要素名一覧も大変役に立っております。
ありがとうございます!!

>ミス・モレを発見しましたら管理人まで

とありましたのでひとつ

カレンダーのタイトルの要素名が違っておりましたので
お知らせまで

#calender caption(正しくは、derのeがaになりますね)

今後も参考にさせていただきます。

投稿: uzu | 2007/06/24 09:30

■uzuさん
こんにちは、はじめまして。

>#calender caption(正しくは、derのeがaになりますね)

ホントですね。失礼しました^^;
長音記号で伸ばす単語の場合、末尾「er」が付くようなイメージが強くて、「カレンダー」はどっちだったかよく迷うんですよね。
なのでいつも確認しているつもりだったのですが、モレちゃってたようですね~(T_T)お恥ずかしい限りです(汗)
お知らせ頂いて助かりました。早速修正いたしました。

uzuさんもこれからも楽しんでカスタマイズ続けて下さいね。

コメント、ありがとうございました♪

投稿: tako→uzuさん | 2007/06/24 10:46

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/2654/2274394

この記事へのトラックバック一覧です: 基本5:カスタム・テンプレート用CSSの主な要素名一覧:

» ココログベーシックのカスタマイズ【その2】 [お前にはまだわからない。]
前回のエントリの続きです。 ウィザードに従ってデザインを進めていきましたが、細か [続きを読む]

受信: 2008/01/25 22:39

« 第32回:自分専用のfavicon(ファビコン)を付けてみよう | トップページ | ブログ便利ツール:ブログ専用検索サイト »