資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法學研究使用HTML、CSS和PHP建立簡單的聯絡表單
聯絡表單是允許使用者透過您的網站直接與您聯絡的好方法。聯絡表單是任何網站的重要組成部分，因為它允許訪問者與網站所有者取得聯絡。網站上的聯絡表單為訪問者提供了提問、詢問或提供反饋的簡便方法。
在本教程中，我們將討論如何使用HTML、CSS和PHP建立一個簡單的聯絡表單。
步驟1：建立HTML表單
建立聯絡表單的第一步是使用HTML建立其結構。在此步驟中，我們將建立表單元素，允許訪問者輸入其資訊並將其傳送給網站所有者。
步驟2：CSS - 樣式表單
建立聯絡表單的下一步是使用CSS對其進行樣式設定。雖然可以建立沒有任何樣式的基本表單，但新增一些設計元素可以使其看起來更專業且更具視覺吸引力。這是一個帶有基本CSS樣式的聯絡表單示例：
<!DOCTYPE html>
<html>
<head>
<title> Contact Form </title>
<style>
body {
font-family : Arial, sans-serif;
}
h1 {
text-align : center;
}
form { margin : auto; max-width: 500px;
}
label {
display : block; margin-bottom: 10px;
}
input[type = "text"], input[type = "email"], textarea { padding: 10px; width: 100%; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin-bottom: 20px;
}
submit{
background-color : #4CAF50;
color : #fff;
padding : 10px 20px; border : none; border-radius : 4px; cursor : pointer;
}
button:hover {
background-color : #3e8e41;
}
</style>
</head>
<body>
<h1> Contact Us </h1>
<form method = "post" action = "sendmail.php" >
<label for = "name" > Name: </label>
<input type = "text" name = "name" id = "name" required>
<label for = "email" > Email: </label>
<input type = "email" name = "email" id = "email" required>
<label for = "message" > Message: </label>
<textarea name = "message" id = "message" required></textarea>
<button type = ”submit” name = ”submit”> Submit </buton>
</form>
</body>
我們首先在程式碼中定義一個聯絡表單。“<!DOCTYPE html>”宣告文件型別為HTML5；程式碼定義了一個將使用post方法提交給名為“sendmail.php”的PHP指令碼的表單。
該表單包含三個輸入欄位：姓名、電子郵件和訊息；當用戶單擊“提交”按鈕時，表單的資料將傳送到PHP指令碼進行處理。
此CSS程式碼將使用簡單、現代的設計來設定表單樣式。“body”元素設定字體系列，“h1”元素居中“聯絡我們”標題。“form”元素居中表單並將最大寬度設定為500px。
“label”元素為輸入欄位的標籤新增間距和樣式。輸入欄位本身採用填充、邊框和邊距屬性進行樣式設定，並且按鈕元素建立一個引人注目的按鈕，並在懸停時更改顏色。
步驟3：建立PHP指令碼
現在我們已經建立了HTML表單並對其進行了樣式設定，我們需要建立一個PHP指令碼，該指令碼將處理表單提交併將訊息傳送給網站所有者。以下是一個您可以使用的簡單的PHP程式碼：
示例
<?php
if(isset($_POST['submit'])){
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$to = "your-email@xyz.com";
$subject = "New Message from Contact Form";
$body = "Name : $name
Email: $email
$message";
mail($to,$subject,$body);
echo "Thank you for your message!";
}
?>
此程式碼首先透過檢查是否已按下“提交”按鈕來檢查表單是否已提交。如果已按下，則程式碼檢索表單欄位的值並將其儲存在變數中，“$to”變數應設定為要將表單提交發送到的電子郵件地址。
接下來的幾行建立將傳送的電子郵件。“$subject”變數是表單的主題，“$body”變數包含透過表單提交的訊息。“mail()”函式將電子郵件傳送到指定的電子郵件地址。
總之，使用HTML、CSS和PHP建立簡單的聯絡表單對於任何網站都至關重要。它允許訪問者與網站所有者聯絡，透過遵循本文中概述的步驟，您可以建立一個基本的聯絡表單，這將幫助您與網站訪問者保持聯絡。
4K+ 次瀏覽
