はじめまして。

ＨＰページをスマホでみたとき、スマホタイプページにとばしたいと考えています。

スマホでＰＣ用のページを見たとき、上部に「スマートフォン版はこちら」のバナーを
つけたいのですが（添付した画像の様に）、やり方がわかりません。

下記のようなコードを考えたのですが、

.smtbtn {
display: none;
padding: 10px;
background-color: #132a6d;
text-align: center;
font-size: 0;
}

<div class="smtbtn"><a href="○○"><img src="images/●●.gif" alt="スマートフォン版はこちら" width="700" height="100" /></a></div>

これだけでは、ダメですよね…。
パソコンで見たときは、そのバナーは隠れていて、
スマホで見たときだけ、上部にバナーがあられるようにしたいのですが。

まわりに聞ける人がいないので、こちらで質問致しました。
どうぞ宜しくお願い致します。