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

2014年03月19日 03:23
カテゴリ: ホームページ制作系

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

最近増えてますよね。

 

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

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

という表示の物を、

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

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

 

そういう時は、

html


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


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

スマホ用のcssに、

CSS


.sample{
	display:block;
}


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

 

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

 

 

この記事が少しでも役立ったらハートを押してね！

執筆者

大岩智将

大岩 智将 OHIWA Tomoyuki

兵庫県加古川市を拠点に活動するWebディレクター / デザイナー。「縁グラフィクション」代表。 お客様との「縁」を大切に、心に響くクリエイティブを提案しています。 日々の制作の裏側や、役立つTipsをブログで発信中。→詳しい紹介

【レンタルサーバーご検討中の方へ】
このブログはエックスサーバーを使用しています。
さくらインターネットも使いやすいですよ。

同じカテゴリの記事