2014年3月19日水曜日

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

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

最近増えてますよね。

 

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

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

という表示の物を、

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

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

 

そういう時は、

html

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


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

スマホ用のcssに、

CSS

.sample{
display:block;
}


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

 

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

 

 

0 件のコメント :