Semantic UIでPC、タブレット、モバイルそれぞれのときのみ表示したい場合

今回はSemantic UIでPC、タブレット、モバイルそれぞれのときのみ要素を表示したい場合どのようにすれば良いのかについてご紹介いたします。



Semantic UIでPC、タブレット、モバイルそれぞれのときのみ表示したい場合

Semantic UIでPC、タブレット、モバイルそれぞれのときのみ表示したい場合

結論を言ってしまうと、下記の公式ドキュメントの最後に記載があります。
https://semantic-ui.com/collections/grid.html#/overview

PCのみ表示させたい要素であれば「computer only」や「large screen only」、タブレットのみ表示させたい要素であれば「tablet only」、スマホなどモバイルのみで表示させたい要素であれば「mobile only」などをclassとして指定してあげれば、表題の内容を実現できます。

終わりに

今回はSemantic UIでPC、タブレット、モバイルそれぞれのときのみ要素を表示したい場合どのようにすれば良いのかについてご紹介いたしました。

最後までお読みいただきありがとうございます。
ブログやTwitterでのシェアOKです。
コメントもお待ちしております。
誤植や勘違いなどございましたらコメント欄にて教えていただけると幸いです。

Youtubeチャンネル開設いたしました。
よろしければチャンネル登録お願いいたします。
https://www.youtube.com/channel/UC219XhmSRxmXltTy6COxSMw