パソコンとスマホで表示を切り替える。pc,sp表示と、非表示

LinkedIn にシェア
LINEで送る
Pocket
このエントリーを Google ブックマーク に追加

スタッフメモ

<div class="pc">パソコンで表示</div>
<div class="sp">スマホで表示</div>

html demo

パソコンで表示
スマホで表示

CSS(インライン)

<style type='text/css'>
.pc { display: block !important; }
.sp { display: none !important; }
@media only screen and (max-width: 750px) {
.pc { display: none !important; }
.sp { display: block !important; }
}
</style>

参考サイト。
https://fastcoding.jp/blog/all/frontend/responsive_img/

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>