昨日の続きです。 昨日は、CSSを使った吹き出しを理解することころまででした。 今日はそれを応用して、モバイル版の吹き出しの形を少しだけ変えていきます。 ちなみに、この方法は「はてなブログPro」を利用している方のみ可能だとういう事を先に書いておきます。 では、早速。 ★ちなみに前回の記事はこちらです はてなブログで吹き出しを使おう! CSSでの実装方法を勉強したので解説します。 - いつもマイナーチェンジ! 目指すイメージ まず、PC版はこんな感じ。 モバイル版はこう。 画像が真ん中に配置されたのに加えて、吹き出しの三角も上辺の真ん中に移動しています。 こんな感じで、PCから見るか、モバイル端末から見るかによって、自動で見え方を変えたいわけです。 スマホの画面って横幅が狭いので、PC版のレイアウトだと文章が読みにくいですからね。 では、やっていきます。 モバイル版のCSS 使っているCS
![はてなブログで吹き出しを使おう!(その2)モバイル版の吹き出しCSS作成。 - いつもマイナーチェンジ!](https://cdn-ak-scissors.b.st-hatena.com/image/square/83a010ee6e8eabfe0d91a97aef8979aa208ac97c/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fm%2Fmayoi_inu%2F20150505%2F20150505212132.jpg)