কিভাবে তৈরি করা যায়: স্ট্যাকলেড ফর্ম

কিভাবে CSS ব্যবহার করে স্ট্যাকলেড ফর্ম তৈরি করা যায়

স্ট্যাকলেড ফর্ম

একটি সমকোণীয় স্ট্যাকলেড ফর্ম (যেখানে ইনপুট বক্স এবং ট্যাগ একে অপরের উপরে দিয়ে গিয়েছে, না হলেও পার্শ্ববর্তীভাবে গিয়েছে):

亲自试一试

একটি স্ট্যাকলেড ফর্ম কিভাবে তৈরি করা যায়

প্রথম পদক্ষেপ - এইচটিএমএল যোগ করুন：

ফর্ম ইলেমেন্ট ব্যবহার করে ইনপুট প্রক্রিয়াকরণ করুন। আপনি আমাদের PHP টিউটোরিয়াল তথ্য জানতে আরও বেশি জানুন।

প্রত্যেক ফিল্ডের ইনপুট কন্ট্রোল যোগ করুন (এবং সাথে সম্পর্কিত লেবেল):

<form action="/action_page.php">
  <label for="fname">First Name</label>
  <input type="text" id="fname" name="firstname" placeholder="Your name..">
  <label for="lname">Last Name</label>
  <input type="text" id="lname" name="lastname" placeholder="Your last name..">
  <label for="country">Country</label>
  <select id="country" name="country">
    <option value="australia">Australia</option>
    <option value="canada">Canada</option>
    <option value="usa">USA</option>
  </select>
  <input type="submit" value="Submit">
</form>

দ্বিতীয় পদক্ষেপ - সিএসএস যোগ করুন:

/* ইনপুট ফিল্ডের শৈলী নির্ধারণ করুন */
  input[type=text], select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}
/* সমর্থন বাটনের শৈলী নির্ধারণ করুন */
input[type=submit] {
  width: 100%;
  background-color: #04AA6D;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
/* মাউস হভারের সময় সমর্থন বাটনের পিছনভূমির রঙ যোগ করুন */
input[type=submit]:hover {
  background-color: #45a049;
}

亲自试一试

相关页面

教程：HTML ফর্ম

教程：CSS ফর্ম