HTML + Basic CSS ব্যবহার করে Contact Form তৈরী

GFX CLICK
19 Jul, 2025



🧾 Contact Form-এর মূল অংশগুলো:

  • নাম লেখার বক্স

  • ইমেইল লেখার বক্স

  • মেসেজ লেখার বড় বক্স

  • সাবমিট বাটন

✅ Simple Contact Form (HTML + Basic CSS):


<!DOCTYPE html>
<html>
  <head>
    <title>যোগাযোগ ফর্ম</title>
    <style>
      body {
        font-family: Arial, sans-serif;
        background-color: #f2f2f2;
        padding: 20px;
        display: flex;
        justify-content: center;
      }

      .contact-form {
        background: white;
        padding: 30px;
        border-radius: 10px;
        width: 100%;
        max-width: 400px;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
      }

      .contact-form h2 {
        margin-bottom: 20px;
        color: #333;
      }

      .contact-form input,
      .contact-form textarea {
        width: 100%;
        padding: 10px;
        margin-bottom: 15px;
        border: 1px solid #ccc;
        border-radius: 5px;
      }

      .contact-form button {
        background-color: #3498db;
        color: white;
        padding: 10px;
        border: none;
        border-radius: 5px;
        width: 100%;
        font-size: 16px;
      }
    </style>
  </head>
  <body>
    <div class="contact-form">
      <h2>যোগাযোগ করুন</h2>
      <form>
        <input type="text" placeholder="আপনার নাম" required>
        <input type="email" placeholder="আপনার ইমেইল" required>
        <textarea rows="5" placeholder="আপনার বার্তা..." required></textarea>
        <button type="submit">পাঠান</button>
      </form>
    </div>
  </body>
</html>

🧠 কিছু গুরুত্বপূর্ণ বিষয়:

  • input = ছোট বক্স (নাম, ইমেইল)

  • textarea = বড় বক্স (মেসেজ)

  • button = পাঠানোর জন্য

  • required = ফাঁকা থাকলে সাবমিট হবে না

🔄 এখন কীভাবে কাজ করে?

এই ফর্ম এখন শুধু ফ্রন্টএন্ড (দেখানোর জন্য)।
যদি তুমি চাও যে পাঠানো ডেটা ইমেইলে যাক বা ডাটাবেসে জমা হোক, তাহলে ব্যাকএন্ড (PHP, Node.js ইত্যাদি) দরকার।

GFX CLICK

GFX CLICK

I Want to Provide a Best Graphics Design Service and Digital IT Solutions.

Next Post Previous Post
No Comment
Add Comment
comment url