田舎のおじさんが気になった事を書いています。

田舎者のブログ

パソコン

今更ながらワードプレスの吹き出し使ってみました。

wordpress

ワードプレスはかなり便利だと今頃思っていましたけど

今頃とは思いますけど吹き出しを使ってみました。

これのようです。

登場人物A

ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。

登場人物B

ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。

 

こんな感じになりました。

なるほど便利に簡単に吹き出し出来ました。

後はここに画像を入れることです。

コードはこちらです。

<div class="chat-l"><div class="talker"><b><img class="circle" alt="登場人物A" src="./images/cast01.jpg">登場人物A</b></div><div class="bubble-wrap"><div class="bubble rc8"><div class="bubble-in">

<p>ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。</p>

</div></div></div></div>

<div class="chat-r"><div class="talker"><b><img class="circle" alt="登場人物B" src="./images/cast02.jpg">登場人物B</b></div><div class="bubble-wrap"><div class="bubble rc8"><div class="bubble-in">

<p>ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。ここにセリフが入ります。</p>


</div></div></div></div>

何やら複雑そうですけど

やってみるとそうでもないです。

 

-パソコン

Copyright© 田舎者のブログ , 2020 All Rights Reserved Powered by AFFINGER5.