電話番号をwebサイトに記載する場合、どのようなタグで囲み、書いていますか?
タグによってはブラウザ判断で意図しないスタイルが当たってしまったり、そのスタイルを上書きできないという場面があったりします。
電話番号はaタグ+hrefで書く
1 |
<a href="tel:0123456789">0123-456-789</a> |
こうするメリット
- 余計なスタイルが当たることがない(reset.cssなどでaタグに当たるスタイルを消している前提)
- スマホで電話番号をタップするとすぐに電話がかけられる
ほぼほぼセットで使うcss
1 2 3 |
text-decoration:none; //pc画面サイズで pointer-events:none; |
aタグにつくアンダーラインはいらないのでtext-decoration:none;でけす
pc画面では電話をかけないのでクリックなどのイベントを消すためにpointer-events:none;をつける。スマホではタップできるようにしたいのでメディアクエリを使うことに注意
以上
コメント