「W600black」:大きめの画像を表示するスキン | タコノキはうまく踊れない

「W600black」:大きめの画像を表示するスキン



$タコノキはうまく踊れない 今回グルっぽで配布する「W600black」は、「幅600pxの画像を記事に置ける」ようにカラムレイアウトを配分しています。特にメッセージボードを非表示にすると、ブログトップアクセス時の最新記事表示スペースが大きいので、画像ブログさん向き(のつもりで、作ったw)。(SSは、GoogleChrome/テーマ:Grayscale
 大きな画像の周囲に白枠線を引くCSSを、スキンCSSに仕込んであります(幅598px以上の画像を想定)。imgタグの(自動で入っている)「border="0"」を消して、「class="w598"」を入れてください。
▽例
<img src="[画像URL]" alt="[ブログ名]" border="0" />
  ↓
<img src="[画像URL]" alt="[ブログ名]" class="w598" />
(例はこの記事の最初の画像。オリジナルのサイズは幅800pxです。「class="w598"」を入れると自動的に画像が記事からはみ出さないよう縮小します。クリックすると画像一覧ページに飛び、画像一覧ページでは原寸表示されます。ただしブラウザの縮小機能ですので、画像加工ソフトで縮小するより、画質は劣ります)
「class="l"」で左寄せ、「class="r"」で右寄せになります。白枠線は引きません。


▽タグの表示って?という方は、
(1)投稿画面の画像ボタンをクリックして、(2)「オリジナルで表示」をチェックしてから「画像を使う」をクリック、(3)HTMLタグを表示をクリック、(4)タグが表示されます。

解説4 タコノキはうまく踊れない

解説3 解説2


【おまけ】シンプル&ヘッダ小さめの公式スキンデザイン

(画像ブログ向きだと思うもの)
▽スイッチャー.02:7colors[AmeLab]
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=sss_02_sevencolors
▽スイッチャー.02:7dark[AmeLab]
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=sss_02_dark
▽スイッチャー.04[AmeLab]
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=sss_04
▽スイッチャー.05[AmeLab]
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=sss_05
▽ラビットペーパー
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=rabbit_paper
◆スイッチャーシリーズリンク
(ヘッダ大きめ)
▽スイッチャー.01[AmeLab]
http://blog.ameba.jp/ucs/skin/srvskinpreview.do?skin_code=sss_01
03影絵が見つからない^^;