スマホ版のみ改行したい時（リキッドデザイン）

1つのHTMLで、パソコン用・スマートフォン用とレスポンシブ対応のホームページ制作をしている時。

最近増えてますよね。

 

その中で例えば、パソコン版で

=================PC=====================
【サンプルタイトル】サンプルテキスト
========================================

という表示の物を、

=================スマホ===================
【サンプルタイトル】
サンプルテキスト
========================================

という風に改行したいな～って場面があると思います。

 

そういう時は、

html

【サンプルタイトル】<span class="sample">サンプルテキスト</span>

htmlをこんな風に、改行させたいところでclass指定して、（spanじゃないといけないってことはないです）

スマホ用のcssに、

CSS

.sample{
	display:block;
}

とすれば、改行できますよ(^^)

 

ご存じなかった方はやってみてね♪