福岡で伝わるホームページを制作している安武寿です。
今日は「画像をWEB上で編集する③ - 画像サイズの変更」の続きで、背景をブログ内に設置するやり方をお伝えします
＜背景をブログに埋め込むやり方＞
--- まず最初にブログ内に画像コードを表示させる ---
「画像」をクリックします。
「画像の追加」という画面が開いたら、その中の「ファイルを選択」をクリックします。
※どの「ファイルを選択」ボタンをクリックしてもかまいません。
背景にしたい画像を選択し、「開く」ボタンをクリックします。
背景にしたい画像が選択されているか、アップロード予定のファイル名を確認し、「アップロード」ボタンをクリックします。
サイズを「オリジナルで表示」を選び、背景にしたい画像の下にある「この画像を使う」をクリックします。
上の作業（まず最初にブログ内に画像コードを表示させる）が完了すると下の図のように、画像を表示させるためのコードが表示されます。
--- ここから背景設定をしていきます ---
まずは、下の★～★の間のコードを全てコピーし、自分の「タグ編集エディタ」に張り付ける。
★
<div style="background-image:url(■■■■);background-repeat:no-repeat;border:solid 1px #cccccc;width:●●●●px;height:◆◆◆◆px;padding:40px 30px 0px 30px;">▲▲▲▲</div>
★
| 貼り付けが終わったら、 下記に沿って、コードの記号内（■■■■など）を変更する。 | |
| ■■■■ ＝ | 下の図の「◎～◎」にあたる、あなたの画像コードを切り取り、■■■■へ張り付ける |
| ●●●● ＝ | 背景画像と同じ横幅に設定する |
| ◆◆◆◆ ＝ | 背景画像と同じ高さに設定する |
| ▲▲▲▲ ＝ | 文章を入れる |
これで完了です。
何度かやると、なれますよ。
類似記事
●画像をWEB上で編集する① - 背景を調整し見やすくする
●画像をWEB上で編集する② - 透過させる
●画像をWEB上で編集する③ - 画像サイズの変更
最後までご覧頂きありがとうございました。
福岡ホームページ制作会社 ファンクリップ 安武寿
(上記リンクを押すと、新画面が開きファンクリップのホームページに遷移します)