จะแก้ไขComponentJoomla ในส่วนที่บอกว่าอยู่ขั้นตอนไหนให้เป็นสามเหลี่ยมยังไงหรอครับจากตอนแรกเป็นเหลี่ยมต้องการให้เป็นเหมือนรูปข้างล่างจะต้องทำยังไงครับ
จะแก้ไข ComponentJoomla ในส่วนที่บอกว่าอยู่ขั้นตอนไหนให้เป็นสามเหลี่ยมยังไงหรอครับ
Moderator: mindphp, ผู้ดูแลกระดาน
- pond
- PHP Super Hero Member
- โพสต์: 570
- ลงทะเบียนเมื่อ: 25/05/2016 9:44 am
จะแก้ไข ComponentJoomla ในส่วนที่บอกว่าอยู่ขั้นตอนไหนให้เป็นสามเหลี่ยมยังไงหรอครับ
แก้ไขล่าสุดโดย pond เมื่อ 24/09/2016 3:50 pm, แก้ไขไปแล้ว 2 ครั้ง.
- pond
- PHP Super Hero Member
- โพสต์: 570
- ลงทะเบียนเมื่อ: 25/05/2016 9:44 am
Re: จะแก้ไข Component ในส่วนที่บอกว่าอยู่ขั้นตอนไหนให้เป็นสามเหลี่ยมยังไงหรอครับ
ได้แล้วครับต้องเข้าไป โอเวอร์ไรด์ไฟล์ส่วนที่แสดงผล
้ html
css
้ html
โค้ด: เลือกทั้งหมด
<div class="btn-group btn-breadcrumb">
<a href="#" class="btn btn-default">รายการสั่งซื้อสินค้า</a>
<a href="#" class="btn btn-default">ระบุสถานที่จัดส่งสินค้า</a>
<a href="#" class="btn btn-default">ยืนยันคำสั่งซื้อ</a>
</div>
โค้ด: เลือกทั้งหมด
.btn-breadcrumb .btn:not(:last-child):after {
content: " ";
display: block;
width: 0;
height: 0;
border-top: 17px solid transparent;
border-bottom: 17px solid transparent;
border-left: 10px solid white;
position: absolute;
top: 50%;
margin-top: -17px;
left: 100%;
z-index: 3;
}
.btn-breadcrumb .btn:not(:last-child):before {
content: " ";
display: block;
width: 0;
height: 0;
border-top: 17px solid transparent;
border-bottom: 17px solid transparent;
border-left: 10px solid rgb(173, 173, 173);
position: absolute;
top: 50%;
margin-top: -17px;
margin-left: 1px;
left: 100%;
z-index: 3;
}
/** The Spacing **/
.btn-breadcrumb .btn {
padding:6px 12px 6px 24px;
}
.btn-breadcrumb .btn:first-child {
padding:6px 6px 6px 10px;
}
.btn-breadcrumb .btn:last-child {
padding:6px 18px 6px 24px;
}
/** Default button **/
.btn-breadcrumb .btn.btn-default:not(:last-child):after {
border-left: 10px solid #fff;
}
.btn-breadcrumb .btn.btn-default:not(:last-child):before {
border-left: 10px solid #ccc;
}
.btn-breadcrumb .btn.btn-default:hover:not(:last-child):after {
border-left: 10px solid #ebebeb;
}
.btn-breadcrumb .btn.btn-default:hover:not(:last-child):before {
border-left: 10px solid #adadad;
}
ผู้ใช้งานขณะนี้
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 96