ヘッダー画像に鯉のぼりズゴックを配置

鯉のぼりズゴックスクリーン

5月になりましたので
またまたヘッダー画像を変更!!
『 鯉のぼりズゴック 』 にしてみました。

鯉のぼりズゴック ズゴック桜

使用した画像は左側の物で
以前は右側の 桜ズゴック でした。
今回の 鯉のぼり と 兜の折り紙 は
100均で売っていた物を使っています。
そのため鯉のぼりはちょっと作りが荒いですが
そのあたりは大目に見てください。

季節によって ヘッダー画像をちょこちょこ変えてみようかと思っています。
他のキャラクター出してみるのもいいですね!


人気ブログランキングへ
関連記事

tag : MG ズゴック ヘッダー画像

コメントの投稿

非公開コメント

No title

更新お疲れ様です。
一つ気になったんですが、ヘッダ画像の貼り付け方って
どうやってやるんですか?
自分もやってみたいんですが、分かりませんw

Re: No title

> 更新お疲れ様です。
> 一つ気になったんですが、ヘッダ画像の貼り付け方って
> どうやってやるんですか?
> 自分もやってみたいんですが、分かりませんw

ヘッダー画像挿入方法ですが
まずヘッダーに差し込みたい画像を用意します。
サイズはヘッダーに合わせてペイント等のソフトでいじってくださいね。。
それから 『ファイルのアップロード』 で画像を登録しておきます。
で、ここからが面倒なんですが
『テンプレートの設定』 を開いてもらって
(わけわからない文字がいっぱいあると思いますが)
『○○のスタイルシート編集』 を見てください。
その中の 『header』 という部分をまずは探してください。
ここはテンプレによって違ってくるので一概に言えませんが
私の場合は
header {
width: 100%;
padding-bottom:10px;
padding-top:30px;
margin-bottom: 10px;
background:#666666;}

こんなカンジになっています。

ここに
/* ヘッダー画像置き場 */
background-image:url(URLを入れてね);
background-repeat:no-repeat;
background-position:center;
/* ヘッダー画像置き場 ここまで */
コイツを入れます。

入れると
header {
width: 100%;
padding-bottom:10px;
padding-top:30px;
margin-bottom: 10px;
background:#666666;
/* ヘッダー画像置き場 */
background-image:url(URLを入れてね);
background-repeat:no-repeat;
background-position:center;
/* ヘッダー画像置き場 ここまで */
}
こういうふうになります。
URLを入れてね の部分に先ほどアップロードした画像のURLを入れればOKです。
URLは http://blog-imgs-○○○○.jpg こんなやつね。
私の場合は横長の画像で写真を左右に真ん中を黒くしたものを作って
それ自体を中央に配置しています。
もし画像を左だけに置きたい場合は
background-position:center;
ここの center を left に変えればいけます。
また逆に右の場合は right にしてみてください。
色々いじってみると面白いですよ!

HTMLやCSSってまだまだ勉強中のため
間違ってたらごめんなさいね(o´д`o)
メニュー
アクセスカウンター
オンラインカウンター
現在の閲覧者数
オススメ商品








































最新記事
amazon お買い得おもちゃ
検索フォーム
カテゴリ
月別アーカイブ
RSSリンクの表示
最新コメント
広告
メールフォーム

名前:
メール:
件名:
本文:

プロフィール

miffy.burian

Author:miffy.burian
いい歳して模型製作に
情熱をささげつつも
かわいらしいMiffyを
愛してしまう浮気者。

完成品&レビュー
Twitter
リンク
アクセスランキング
[ジャンルランキング]
趣味・実用
27位
アクセスランキングを見る>>

[サブジャンルランキング]
模型・プラモデル
7位
アクセスランキングを見る>>
フリーエリア
ネットでの出会い