HTMLの「href mailto」属性を使用したメールリンクの作成方法


以下に、いくつかの方法とコード例を示します。

方法1: テキストリンクを作成する方法

<a href="mailto:[email protected]">メールを送信する</a>

このコード例では、mailto:の後に宛先のメールアドレスを指定しています。ユーザーが「メールを送信する」というリンクをクリックすると、デフォルトのメールクライアントが開かれ、[email protected]宛ての新しいメール作成画面が表示されます。

方法2: 画像をクリックできるメールリンクを作成する方法

<a href="mailto:[email protected]">
  <img src="email-icon.png" alt="メールを送信する">
</a>

このコード例では、<a>要素内に<img>要素を配置しています。ユーザーが「メールを送信する」という画像をクリックすると、同様にデフォルトのメールクライアントが開かれ、[email protected]宛ての新しいメール作成画面が表示されます。

方法3: JavaScriptを使用してメールリンクを作成する方法

<script>
  function sendEmail() {
    window.location.href = "mailto:[email protected]";
  }
</script>
<a href="#" onclick="sendEmail();">メールを送信する</a>

このコード例では、JavaScriptを使用してメールリンクを作成しています。sendEmail()という関数が定義され、ユーザーが「メールを送信する」というリンクをクリックすると、window.location.hrefを使用してデフォルトのメールクライアントが開かれます。宛先のメールアドレスは、関数内で指定することができます。

これらはいくつかの一般的な方法ですが、さまざまなカスタマイズやスタイリングの方法もあります。必要に応じて、これらのコード例を自分のウェブサイトやプロジェクトに適用してください。