কিভাবে তৈরি করা: বার্টিক্যাল বাটন গ্রুপ

কিভাবে CSS ব্যবহার করে বার্টিক্যাল 'বাটন গ্রুপ' তৈরি করা শিখুন。

বার্টিক্যাল বাটন গ্রুপ

একসমূহ বাটনকে বার্টিক্যাল বাটন গ্রুপে গ্রুপ করা:

亲自试一试

বার্টিক্যাল বাটন গ্রুপ কিভাবে তৈরি করা

প্রথম পদক্ষেপ - HTML যোগ করা:

<div class="btn-group">
  <button>Apple</button>
  <button>Samsung</button>
  <button>Sony</button>
</div>

দ্বিতীয় পদক্ষেপ - CSS যোগ করা:

.btn-group button {
  background-color: #04AA6D; /* সবুজ পিছনদিক রঙ */
  border: 1px solid green; /* সবুজ ফ্রেম */
  color: white; /* সাদা লেখা */
  padding: 10px 24px; /* কিছু ইনপেডিং */
  cursor: pointer; /* মাউস ইনডিকেটর/হ্যান্ড আইকন */
  width: 50%; /* যদি প্রয়োজন, প্রস্থ সমায়োজন */
  display: block; /* বাটনগুলো স্ট্যাক করা */
}
.btn-group button:not(:last-child) {
  border-bottom: none; /* দুইদিকের ফ্রেম রক্ষা করা */
}
/* মাউস সামনে আছলে পিছনদিক রঙ যোগ করা */
.btn-group button:hover {
  background-color: #3e8e41;
}

亲自试一试

相关页面

教程:সিএসএস বাটন