使用a标签发送邮件（收件人，抄送地址，密件抄送地址，邮件主题，邮件内容）

人间小美味695

已于 2022-11-18 23:08:43 修改

阅读量2.6k

点赞数 17

分类专栏：前端前端相关文章标签： a标签发送邮件

于 2021-05-24 14:18:10 首次发布

本文链接：https://blog.csdn.net/cainiaoyihao_/article/details/117219543

版权

前端同时被 2 个专栏收录

25 篇文章 8 订阅

订阅专栏

前端相关

5 篇文章 0 订阅

订阅专栏

参数	说明
mailto	收件人
cc	抄送地址
bcc	添加密件抄送地址
subject	邮件主题
body	邮件内容（换行 `%0A`）

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>使用a标签发送邮件(完整版)</title>
    <style>
        /* .cons {
            height: 60px;
            display: flex;
            display: -moz-flex;
            display: -o-flex;
            display: -webkit-flex;
            display: -ms-flex;
            justify-content: center;
            align-items: center;
        } */
        
        #mailTo {
            display: block;
            text-align: center;
            height: 60px;
            line-height: 60px;
            text-decoration: none;
        }
    </style>
</head>

<body>
    <!-- mailto：收件人 -->
    <!-- cc：抄送地址 -->
    <!-- bcc：添加密件抄送地址 -->
    <!-- subject：邮件主题 -->
    <!-- body：邮件内容（换行%0A） -->

    <!-- <div class="cons"> -->
    <a id="mailTo" href="mailto:1434154130@qq.com?cc=l1305658033@163.com&bcc=1305658033@qq.com&subject=[我是主题]&body=我是邮件内容%0A%0Ahttp://www.baidu.com%0A%0A<img src='https://liujianwei695.gitee.io/minifile/images/officialAccount.jpg' />">点击我发邮件</a>
    <!-- </div> -->
</body>

</html>

三、a标签水平垂直居中

1、display:block

<a id="mailTo" href="mailto:1434154130@qq.com?cc=l1305658033@163.com&bcc=1305658033@qq.com&subject=[我是主题]&body=我是邮件内容%0A%0Ahttp://www.baidu.com%0A%0A<img src='https://liujianwei695.gitee.io/minifile/images/officialAccount.jpg' />">点击我发邮件</a>

#mailTo {
    display: block;
    text-align: center;
    height: 60px;
    line-height: 60px;
    text-decoration: none;
}

2、flex布局

<div class="cons">
    <a id="mailTo" href="mailto:1434154130@qq.com?cc=l1305658033@163.com&bcc=1305658033@qq.com&subject=[我是主题]&body=我是邮件内容%0A%0Ahttp://www.baidu.com%0A%0A<img src='https://liujianwei695.gitee.io/minifile/images/officialAccount.jpg' />">点击我发邮件</a>
</div>

.cons {
    height: 60px;
    display: flex;
    display: -moz-flex;
    display: -o-flex;
    display: -webkit-flex;
    display: -ms-flex;
    justify-content: center;
    align-items: center;
}

四、效果图

在这里插入图片描述

五、更多内容

使用 a标签或 js 群发短信：https://blog.csdn.net/cainiaoyihao_/article/details/116259913

a标签常用属性——你是否都用过？：https://blog.csdn.net/cainiaoyihao_/article/details/116296294