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

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

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

.btn-group button {
  background-color: #04AA6D; /* সবুজ পিছনভাগের রঙ */
  border: 1px solid green; /* সবুজ ফাঁকা */
  color: white; /* সাদা লেখা */
  padding: 10px 24px; /* কিছু অভ্যন্তরীণ সাজানো */
  cursor: pointer; /* মাউস ইঞ্জেক্টর/হ্যান্ড চিহ্ন */
  float: left; /* একদিকের দিকে ফ্লোটিং বাটন */
}
.btn-group button:not(:last-child) {
  border-right: none; /* দুইদিকের ফাঁকা ফাঁকা ফাঁকা ফাঁকা */
}
/* ফ্লোটিং করে সমাপ্ত করা (clearfix hack) */
.btn-group:after {
  content: "";
  clear: both;
  display: table;
}
/* মাউস অবস্থান করার সময় পিছনভাগের রঙ যোগ করা */
.btn-group button:hover {
  background-color: #3e8e41;
}

亲自试一试

<!-- তিনটি বাটন একগুচ্ছে -->
<div class="btn-group" style="width:100%">
  <button style="width:33.3%">Apple</button>
  <button style="width:33.3%">Samsung</button>
  <button style="width:33.3%">Sony</button>

CodeW3C.com 提供的内容仅用于培训和测试，不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关。版权所有，保留一切权利。

কোডউ৩ডউইকি.কম সম্পর্কে কোডউ৩ডউইকি.কম সহায়তা 使用条款 隐私条款