這里非常新，所以我確定我遺漏了一些明顯的東西，但我想要一個 HTML 按鈕，它可以打開用戶本機電子郵件客戶端，其中預先填充了 To: 欄位。
<form>
<button class="button-21" action="mailto:[email protected]" type="submit"> Contact</button>
</form>
這是隨附的 CSS：
.button-21 {
align-items: center;
appearance: none;
background-color: #3eb2fd;
background-image: linear-gradient(1deg, #4f58fd, #149bf3 99%);
background-size: calc(100% 20px) calc(100% 20px);
border-radius: 100px;
border-width: 0;
box-shadow: none;
box-sizing: border-box;
color: #ffffff;
cursor: pointer;
display: inline-flex;
font-family: CircularStd, sans-serif;
font-size: 1rem;
height: auto;
justify-content: center;
line-height: 1.5;
padding: 6px 20px;
position: relative;
text-align: center;
text-decoration: none;
transition: background-color 0.2s, background-position 0.2s;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
vertical-align: top;
white-space: nowrap;
}
.button-21:active,
.button-21:focus {
outline: none;
}
.button-21:hover {
background-position: -20px -20px;
}
.button-21:focus:not(:active) {
box-shadow: rgba(40, 170, 255, 0.25) 0 0 0 0.125em;
uj5u.com熱心網友回復：
action是表單的提交屬性。您應該將 action 屬性從按鈕移動到表單。
.button-21 {
align-items: center;
appearance: none;
background-color: #3eb2fd;
background-image: linear-gradient(1deg, #4f58fd, #149bf3 99%);
background-size: calc(100% 20px) calc(100% 20px);
border-radius: 100px;
border-width: 0;
box-shadow: none;
box-sizing: border-box;
color: #ffffff;
cursor: pointer;
display: inline-flex;
font-family: CircularStd, sans-serif;
font-size: 1rem;
height: auto;
justify-content: center;
line-height: 1.5;
padding: 6px 20px;
position: relative;
text-align: center;
text-decoration: none;
transition: background-color 0.2s, background-position 0.2s;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
vertical-align: top;
white-space: nowrap;
}
.button-21:active,
.button-21:focus {
outline: none;
}
.button-21:hover {
background-position: -20px -20px;
}
.button-21:focus:not(:active) {
box-shadow: rgba(40, 170, 255, 0.25) 0 0 0 0.125em;
}<form action="mailto:[email protected]">
<button class="button-21" type="submit">Contact</button>
</form>uj5u.com熱心網友回復：
嘗試這個 ：）
<form>
<button class="button-21" onclick="location.href='mailto:[email protected]';" type="button"> Contact</button>
</form>
uj5u.com熱心網友回復：
除了表單內的按鈕外，您還可以為此使用鏈接：
<a href="mailto:[email protected]">Contact</a>
uj5u.com熱心網友回復：
<form action="mailto:[email protected]">
<button class="button-21" type="submit"> Contact</button>
</form>
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/433892.html