ケイタイ版 ありのごとくあつまりて

※このページは 携帯向け です。 このメッセージが表示されている場合は、PC版 記事 もしくは スマホ版 記事 への移動をお願いします。
ケイタイ版 では一部の画像が表示されなかったり、レイアウトが崩れて表示される場合などがあります。


*前の記事 | 次の記事#


テンプレート(CSS内) 背景画像を抽出

2009/10/18  Hatena Twitter
FC2共有テンプレート


スタイルシート(CSS) で設定している画像を 一発で抽出し、以下のようなファイルが簡単に作れたらいいのに・・・。 とか思いながら、手持ちのフリーソフトなどを駆使して 暇人なことをしてみました。

共有テンプレート ari_seo1 で使ってる 背景画像の一覧 です。 画像を差し替えて使いたい方のサイズ確認 や カスタマイズの参考にどうぞ。 ※以下の素材は FC2ブログの共有テンプレート ari_seo1 及び ari_seo2L , ari_seo2M で使用している画像です。 テンプレート利用者以外の持ち帰り(ダウンロード) は禁止させていただきます。

FC2ブログ共有テンプレート ari_seo1
ari_seo1

Large font , cute version?
2009/09/11〜
FC2ブログ共有テンプレート ari_seo2L
ari_seo2L

Large font , for Lady's
2009/10/13〜
FC2ブログ共有テンプレート ari_seo2M
ari_seo2M

Medium font , for Men's
2009/10/14〜
body {
background:#ccc url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/waku_middle.png) repeat-y center top;
background-attachment:fixed;
}
CSS 設定画像
waku_middle.png (148 byte 1KB) 928×13



/* Structure (構造)
------------------------------------- */
#wrapper {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/waku_bottom.png) no-repeat center bottom;
}
CSS 設定画像
waku_bottom.png (1071 byte 2KB) 928×47


#top {
background:#ccc url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/waku_top.png) no-repeat center top;
}
CSS 設定画像
waku_top.png (1063 byte 2KB) 928×66


#header {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_img_r.png) no-repeat;
}
CSS 設定画像
t_img_r.png (11219 byte 11KB) 900×166



/* Navigation
------------------------------------- */
#nav {
background:#000 url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_menu.png) repeat-x;
background:#000 url(http://blog-imgs-35.fc2.com/a/r/i/arinogotokuatumarite/t_menu2.png) repeat-x;
}
CSS 設定画像
t_menu2.png (267 byte 1KB) 70×35


#nav a.this {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_menu_this2.png) no-repeat center bottom;
}
CSS 設定画像
t_menu_this2.png (509 byte 1KB) 70×35


#nav li .navitop:hover, #nav li:hover .navitop {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_menu_this2.png) no-repeat center bottom;
}
CSS 設定画像
t_menu_this2.png (509 byte 1KB) 70×35


/* Feed */
#feed {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_feed1.png) no-repeat;
}
CSS 設定画像
t_feed1.png (775 byte 1KB) 152×25


a.feed-button {
background:url("http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_feed_button.png") no-repeat 0 0;
}
CSS 設定画像
t_feed_button.png (3494 byte 4KB) 100×50


a:hover.feed-button {
background-position:0 -25px;
}

/* Entries
------------------------------------- */
.entry_title {
background:url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_h2_1.png) no-repeat;
}
CSS 設定画像
t_h2_1.png (5744 byte 6KB) 600×131


/* Comment, Trackback
------------------------------------- */
.cm_title {
background:url("http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_cm_1.png") no-repeat;
}
CSS 設定画像
t_cm_1.png (2779 byte 3KB) 600×84


.tb_title {
background:url("http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_tb_1.png") no-repeat;
}
CSS 設定画像
t_tb_1.png (2542 byte 3KB) 600×84



/* 著作権表示部分
------------------------------------- */
#footer .copyright {
background:#5dbec3 url(http://blog-imgs-32.fc2.com/a/r/i/arinogotokuatumarite/t_footer1.png) no-repeat center top;
}
CSS 設定画像
t_footer1.png (4052 byte 4KB) 800×110


テンプレート ari_seo2L , ari_seo2M の場合は 横×縦 のサイズが異なるもの (上のヒヨコの画像関連) もあるので、ご確認ください。

ちなみに、ヒヨコの画像の作者さん mococo の MOKOさんには 共有テンプレートとして登録する前にメールでコンタクトを取らせていただきました。 画像加工などの報告のみのつもりでしたが、温かいお言葉まで頂き... とても感じのよさそうな方でした♪




カテゴリー: FC2共有テンプレート

記事URLをメールする
http://arinogotokuatumarite.blog19.fc2.com/blog-entry-87.html

前: 2010年 写真フレーム年賀状用テンプレート
次: 共有テンプレート サポート専用窓口 (1)


*前の記事 | 次の記事#



コメントを見る (4)
コメントを書く
トラックバック (0)


ブログカスタマイズ中級 (15) / ブログカスタマイズ上級 (30) / FC2共有テンプレート (16) / FC2マニア・仕様関連 (21) / アクセス解析・SEO対策 (18) / ブログ雑記・その他 (8) / TV・NET・GAME (12) / 子育て・日々の出来事 (10) / 得するお役立ち情報 (15) / 無料素材のリンク集 (11) / 無料ソフト・フォント等 (10) / Twitter・ブラウザ関連 (26) /

最近のコメント12件
テンプレートについて

↑ ページ先頭へ ↑
ケイタイ版 トップページへ

ブログURLをメールする

by FC2ブログログイン

i-mobile


無料レンタル掲示板,チャット