ガイドグループ世話人の日記

この草稿ははてなダイアリーガイド「CSSセレクタ」としてキーワード化しました。

ガイドトップ　 目次　 索引

（セレクタ探しトップに戻る）

■ はてなダイアリーガイド「CSSセレクタ - その他のモジュール」

セレクタは全体が「ul.hatena-photo」。

いっこいっこの画像が「ul.hatena-photo li」または「img.hatena-photo」。

画像はリンクになっているので「a img.hatena-photo」でも。リンク状態によって変える場合は

• a img.hatena-photo
  • a:link img.hatena-photo（未訪問）
  • a:visited img.hatena-photo（未訪済み）
  • a:hover img.hatena-photo（マウスオーバー時）
  • a:active img.hatena-photo（クリック時）

応用技は、キーワード「photoモジュール」にも載っています。

ブラウザによって、画像のまわりに枠が表示されるのをやめたい時は（すべての画像で枠が表示されるのをやめたい時は『img {border: none;}』）

img.hatena-photo {
 border: none;
}

のようにします。

== HTML構造概略 ==

 <ul class="hatena_photo">
  <li><a><img class="hatena_photo"></a></li>
  <li>同上</li>
  <li>同上</li>
  <li>同上</li>
 </ul>

■ はてなダイアリーのセレクタ探し - adsenseモジュール

adsenseモジュール。全体にはdiv.adで指定できるけれど、表示にscriptが使用されているので中の要素を個別にはスタイル指定できない。

でもadsenseモジュールを表示するタグのほうで見栄えを変えられるのでした。

Google AdSense広告を表示することができます。ヘッダやフッタに

<hatena name="adsense">

と記述するとAdSense広告が表示されます、が、収益は全てはてなに入るのみです。

<hatena name="adsense" format="180x150" color_link="#0000ff" color_url="#0000ff" color_border="#0000ff" color_bg="#ffffff" color_text="#000000">

と指定することで、広告のフォーマットや、文字などの色を指定することができます。

formatで指定できるのは以下の種類です。

• 728x90
• 468x60 （初期値）
• 234x60
• 125x125
• 120x600
• 160x600
• 120x240
• 300x250
• 250x250
• 336x280
• 180x150

実際の表示イメージはこちらをご覧ください。なお、adsenseモジュールは1ページに1個しか掲載できません。

はてなダイアリーのヘルプ - adsenseモジュール

タグの中に書くものを整理すると、上の画像例で

format="〜x〜"

全体の大きさ

color_link="#色コード"

ブラウザ印刷なら、の部分

color_url="#色コード"

- www.axissoft.co.jp/biz/、の部分

color_border="#色コード"

枠の色

color_bg="#色コード"

Ads by Google、の部分の背景色

color_text="#色コード"

高速レスポンスを可能にした〜、の文字色