「だるころ」(だぁ~るまさんがこぉ~ろんだ♪)

「だるころ治療院」を開設しようと思って、はてなブログを作りました。 https://darucoro.com/

簡単「吹き出し」出来まーす!


スポンサーリンク

★読者登録お願いします

 

 


●絵だけで挑戦●
★会話してる感じ
 
今回も来てくださってありがとうございます。
 
今回はちょっと「吹き出し」について書こうと思います。
このやり方が良いとは思ってませんが、こんな方法でも出来ますよ!を少し紹介してみようと思います。
 
     
●さぁ~遊びましょう!
f:id:darucoro9216kun:20210324164729p:plain

 

f:id:darucoro9216kun:20210325155312p:plain

 
まずは二色の吹き出しを作ります。
(もちろんこれをコピーしてもOKです)
 

f:id:darucoro9216kun:20210325135110p:plain

f:id:darucoro9216kun:20210325140315p:plain

 

2ステップ

好きな画像と吹き出しを順番に並べます。

f:id:darucoro9216kun:20210324164729p:plain

f:id:darucoro9216kun:20210325135110p:plain

f:id:darucoro9216kun:20210325140315p:plain

f:id:darucoro9216kun:20210324170318p:plain

ただ消すだけ!

HTML編集で「絵」と「吹き出し」の間の</p>・<p>を消します。

 

f:id:darucoro9216kun:20210324164729p:plain f:id:darucoro9216kun:20210325135110p:plain

f:id:darucoro9216kun:20210325140315p:plain f:id:darucoro9216kun:20210324170318p:plain

 <p><img src="好きな「絵1」"></p>

<p><img src="吹き出し「画像1」"></p>

<p><img src="好きな「絵2」"></p>

<p><img src="吹き出し「画像2」"></p>

 ※上記の赤い部分を消します!!

そしたら空白ですが、会話してる感じになります。

 <p>は「パラグラフ」の略で「節」ってことです。

 <p><img src="好きな「絵1」"><img src="吹き出し「画像1」"></p>

 一つの括りを長くしただけです。

 あとは文字を書くだけ

 文字をペイントで書いてみました。

f:id:darucoro9216kun:20210324164729p:plain f:id:darucoro9216kun:20210325150547p:plain

f:id:darucoro9216kun:20210325150909p:plainf:id:darucoro9216kun:20210324170310p:plain

 
 
 
●大きさの変更!
 
 四隅のハンドル操作で画像の大きさを変えられます。

f:id:darucoro9216kun:20210325151448p:plain

※画像を小さくして、スマートフォンでもレイアウト確認してください。
もちろん吹き出しも画像なので同じように変更可能です。
 
ペイント操作
「ペイント」アプリを立ち上げて文字を挿入します。
「A」のマークをタップして描きたい場所で枠を広げます。

f:id:darucoro9216kun:20210325152055p:plain

保存したら文字入り吹き出しが出来上がります!
 
出来ました!
 

f:id:darucoro9216kun:20200821094144p:plain

 
●コードを書かずに会話形式完成です。
 

CSS吹き出しを作ると綺麗にできますが、コードに頼らなくても一応出来ます。

※あれ?この方が余計に手間ですか[笑]?

 
 何でも出来たら嬉しい!
 

 

f:id:darucoro9216kun:20210325164522j:image

息子が昔描いたヒマワリです。

もう一度みたくなったので飾ってます。

こんな風に思い切り花の絵を描けたらなぁ〜って観てて思います。

 

また、いつかCSSを使った簡単会話もやってみたら面白いかもですね。

今回は「絵」を使って遊んでみました。

出来たのはいいですが、キャラ設定とか会話内容とか本当におかしいですよね。

適当に作ってる部分がドーンと見えちゃいましたが…作ってる本人は楽しんでます[笑]

 

◎出来ました!◎
 
 
また来てくれる日を
楽しみにしています。
 
ワードプレス記事
「コロナ禍での健康アドバイス」も
よろしくお願いします。
 
画素リンク
☆D-BLOG☆

 

プライバシーポリシー