画像を背景にする方法（かんたんモード）

画像を背景にする方法

 かんたんモードを使って文字の背景に画像を載せる方法を紹介します。

 

使用例

 

 

ここに文字を入れてください

ここに文字を入れてください

ここに文字を入れてください

ここに文字を入れてください

ここに文字を入れてください

ここに文字を入れてください

 

 

HTMLソース

<div style="background:url(http://画像アドレス);
font-size:●pt;color:#■■■■■■;
font-family:○○○○○○;">
<div align="▲">
文章
</div></div>

●・・・文字サイズ(半角数字)　※標準の大きさが8程度。サイズは数字の大きさに比例。
■■■■■■・・・カラーコード6桁(半角英数字)
▲・・・文字位置情報(半角英字)
○○○○○○・・・フォント種別

 

作成方法

１．上記HTMLソースをコピーし、メモ帳などのエディタに貼り付ける。

２．拡張子を「.html」とし、名前を付けて保存する。

３．保存したファイルを開き、右クリック→すべて選択→右クリック→コピー

　　※ショートカットキーCtrl+A→Ctrl+Cでも可。

４．ブログの新規投稿でかんたんモードを選び、本文に貼り付ける。

 

完成品

使用例のソース

<div style="background:url(http://img2.blogs.yahoo.co.jp/ybi/1/c6/17/gpiegsdvuxjcvweguw/folder/976431/img_976431_23376737_1?1297090687);
font-size:12pt;color:#000000;
font-family:ＭＳ Ｐゴシック;">
<div align="center">
文章
</div></div>

---

ブログ名　* KAORのブログ講座 *
URL　http://blogs.yahoo.co.jp/gpiegsdvuxjcvweguw

---

http://www.tokyovalley.com/yahoo_blog/article/article.php

http://www.tokyovalley.com/yahoo_blog/article/article.gif

http://i.yimg.jp/images/auct/blogparts/Seller300250Yellow.swf?s=2&cl=0&sl=j00v1961&di=0&od=0&ti=&pt=2&dotyid=aucy%2Fp%2FoY.q42SxJKnKBiiAft0P8hSx.mwc_lQ-&sid=2219441&pid=878398084

 

 

 

 

 

 

 

 

 

 

 

 

 

 http://www28.atpages.jp/yblninja/ninja.php

 

http://x7.byoubu.com/bin/ll?10430840d

[.]

わ〜い(●ゝω・)ゞ簡単モードだぁ^^
使わせてくださいね^^

嬉しいなぁ(*´pq｀)ｸｽｯありがとうのポッチ★

[やぁ]

訪問ありがとうございます
すいません質問なんですが
記事作成して文書の中に数種類の顔文字を入れると記事が切れて消えたり顔文字が半分にと？
どういった現象なのでしょうか？
教えていただけますか？
m(__)m

[シェルピー]

再訪問ありがとうございました。 携帯での楽しみ方も待ってます

[ぞうさん]

訪問ありがとうございます

これから色々参考にさせていただきます

[名無し]

ありがとうございます。すごいテクをたくさん持っておられて、便利なサイトまで作ってくださり、感謝します。
まだ初心者でこの方法でどこまでこなせれるか、不安なのですが、頑張ってみます。

[ｇｌｏｂａｌ]

勉強になりました(-.-)

[とだん]

拝見しました。
参考にさせてもらいます。

[双龍]

はじめまして
履歴から来ました。
ご訪問ありがとうございます。

色々と参考になる記事ばかり。
簡単なモノから、トライしてみたいと思います。

はじめまして
何度かのご訪問ありがとうございます。

すごい引き出しの持ち主ですね〜。
参考にさせてもらいます。
これからもたまには遊びに来てください。

[poulet-dor]

初めまして


ﾌﾞﾛｸﾞの編集や遊び方 いっぱい勉強してるんですね


Yahoo!のﾌﾞﾛｸﾞは お店ﾌﾞﾛｸﾞとして社長が立ち上げたので…私には 遊び方がわかりません


また 時間あるときに KAOAさんのﾌﾞﾛｸﾞで勉強させていただきたいと思います



長文 失礼しました

[-]

使わせていただきます ポチ

[まお]

はじめまして＾＾
お勉強させていただきます♪
ぽち！

[-]

試してみますね
有難うございました。

初めましてはじめてコメントさせていただきます。
上記の通りやってみたのですが上手くいきません。
<div style="background:url(http://img2.blogs.yahoo.co.jp/ybi/1/c6/17/gpiegsdvuxjcvweguw/folder/976431/img_976431_23376737_1?1297090687);
font-size:12pt;color:#000000;
font-family:ＭＳ Ｐゴシック;">
<div align="center">
文章
</div></div>
これをメモ帳にhtmlで登録しそれを起動しすべてをコピーしたのですが「文章」だけコピーしてバックの画像はコピーしません。
それを貼り付けても「文章」だけが貼り付けられてしまい画像は表示されません。
又画像はブログの記事に載せている画像を使うのですかhtml
で登録したファイルを起動すると文字の幅だけの画像しか表示されません。初めてのコメントで厚かましい事を申しますがよろしかったら指導をいただけますか。ブログは初心者です。

背景の上に文字が書けるなんて素敵ですね。
やってみたいと思います。

[白い蓮]

ありがとうございます、
初心者で何をするにもたどたどしくやっております、
いろいろ勉強させて戴きたいと思います、
今もパソコン本を買ってきたところです。

[-]

訪問有り難う御座います、
PC 前にして、固まってることが多いけど、じっくりと、
勉強させてもらいます。 有り難う御座います。

履歴からきました。。私に使いこなせるかどうか・・がんばって上達したいです