Toggle navigation
Bootsnipp
Bootstrap
For
CSS Frameworks
Bootstrap
Foundation
Semantic UI
Materialize
Pure
Bulma
References
CSS Reference
Tools
Community
Page Builder
Form Builder
Button Builder
Icon Search
Dan's Tools
Diff / Merge
Color Picker
Keyword Tool
Web Fonts
.htaccess Generator
Favicon Generator
Site Speed Test
Snippets
Featured
Tags
By Bootstrap Version
4.1.1
4.0.0
3.3.0
3.2.0
3.1.0
3.0.3
3.0.1
3.0.0
2.3.2
Register
Login
"tabs"
Bootstrap 3.2.0 Snippet by
ITVesPa
3.2.0
tabs
Preview
HTML
View Full Screen
Forked from
Fork
Fork this
Parent
809
 
1 Fav
Post to Facebook
Tweet this
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="page-header"> <h1>ดูรายระเอียด</h1> </div> <div class="row"> <div class="col-md-12"> <div class="panel with-nav-tabs panel-default"> <div class="panel-heading"> <ul class="nav nav-tabs"> <li class="active"><a href="#tab1default" data-toggle="tab">วิทยาศาสตร์และเทคโนโลยี</a></li> <li><a href="#tab2default" data-toggle="tab">ครุศาสตร์</a></li> <li><a href="#tab3default" data-toggle="tab">มนุษย์ศาสตร์และสังคมศาสตร์</a></li> <li><a href="#tab4default" data-toggle="tab">วิทยาการจัดการ</a></li> <li><a href="#tab5default" data-toggle="tab">เทคโนโลยีอุตสาหกรรม</a></li> </ul> </div> <div class="panel-body"> <div class="tab-content"> <div class="tab-pane fade in active" id="tab1default"><div class="row form-group"> <div class="col-sm-3">สาขาวิชาเทคโนโลยีการเกษตร</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <!-- หน้าคณะวิทย--> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาสาธารณสุขศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาชีววิทยาประยุกต์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาเคมี</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาการอาหารและธุรกิจบริการ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาฟิสิกส์ประยุกต์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาอาชีวอนามัยและความปลอดภัย</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาวิทยาศาสตร์สิ่งแวดล้อม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาวิทยาการคอมพิวเตอร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาเทคโนโลยีสารสนเทศ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div></div> <!-- หน้าคณะครุ--> <div class="tab-pane fade" id="tab2default"><div class="row form-group"> <div class="col-sm-3">สาขาวิชาการศึกษาปฐมวัย</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาคณิตศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาคอมพิวเตอร์ศึกษา</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-5">สาขาวิชาเทคโนโลยีการศึกษาและการสอนคอมพิวเตอร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาการสอนภาษาอังกฤษ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาการสอนภาษาไทย</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาภาษาจีน</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาการสอนวิทยาศาสตร์ทั่วไป</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาสังคมศึกษา</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> </div> <!-- หน้าคณะมนุษย์--> <div class="tab-pane fade" id="tab3default"><div class="row form-group"> <div class="col-sm-3">สาขาวิชาการพัฒนาสังคม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาสารสนเทศศาสตร์และบรรณารักษศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาดนตรีสากล</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาภาษาอังกฤษ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชารัฐประศาสนศาสตร์(รป.บ.)</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาศิลปกรรม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชานิติศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชารัฐศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> </div> <!-- หน้าคณะวิทยาการจัดการ--> <div class="tab-pane fade" id="tab4default"><div class="row form-group"> <div class="col-sm-2">สาขาวิชานิเทศศาสตร์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาการท่องเที่ยวและการโรงแรม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาการจัดการ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาการบัญชี</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาการจัดการทรัพยากรมนุษย์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาการตลาด</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-2">สาขาวิชาคอมพิวเตอร์ธุรกิจ</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> </div> <!-- หน้าคณะเทคโน--> <div class="tab-pane fade" id="tab5default"><div class="row form-group"> <div class="col-sm-3">สาขาวิศวกรรมเครื่องกลยานยนต์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาเทคโนโลยีอุตสาหกรรม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาวิศวกรรมไฟฟ้า</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-3">สาขาวิชาออกแบบผลิตภัณฑ์</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> <div class="row form-group"> <div class="col-sm-4">สาขาวิชาวิศวกรรมการจัดการอุตสาหกรรม</div><br> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> <span class="sr-only">60% Complete</span> </div> <span class="progress-completed">60%</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> <br/>
Related:
See More
Template
Paper Kit Pro
255.3K
83
Tabs style 1
221.5K
48
Bootstrap Tabs with Table
37.7K
8
Tabs
Questions / Comments:
Post
Posting Guidelines
Formatting
- Now
×
Close
Donate
BTC: 12JxYMYi6Vt3mx3hcmP3B2oyFiCSF3FhYT
ETH: 0xCD715b2E3549c54A40e6ecAaFeB82138148a6c76