Class ที่เปลี่ยนไปใน Bootstrap 2.x to 3.0

Booststap Knowledge ความรู้สำหรับการออกเว็บเพื่อให้แสดงผล ได้ดี ทุกหน้าจอ

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
M004
PHP VIP Members
PHP VIP Members
โพสต์: 1323
ลงทะเบียนเมื่อ: 01/01/1970 7:00 am

Class ที่เปลี่ยนไปใน Bootstrap 2.x to 3.0

โพสต์ที่ยังไม่ได้อ่าน โดย M004 »

หลังจากที่ Bootstrap Update เป็น v 3.0 คำสั้งจากที่เคยใช้จาก v2.x มีการเปลี่ยนแปลงไปหลายตัว
จากเดิมที่ user สามารถ เลือกใช้งาน Class ว่าต้องการใช้ แบบ grid หรือ แบบ Fluid grid
แต่ v 3.0 นี้ บังคับให้ user ใช้งาน แบบ Fluid grid แบบเต็มตัว ซึ่งก็ถือเป็นข้อดี เพราะปัจจุปัน การใช้งาน website ไม่ได้ ใช่ได้ เเค่จาก computer จึง เป็นผลดีกับ ผู้ใช้งานอื่นๆ นอกจาก Computer

Class ที่มีการเปลี่ยนแปลง

โค้ด: เลือกทั้งหมด

     2.x                               3.0
.container-fluid     =>    .container
.row-fluid             =>   .row
.span*                 =>   .col-md-*

.container-fluid     =>    .container
.row-fluid             =>    .row
.span*                 =>    .col-md-*
.offset* 	           =>    .col-md-offset-*
.brand                  =>    .navbar-brand
.nav-collapse        =>    .navbar-collapse
.nav-toggle           =>    .navbar-toggle
.btn-navbar          =>    .navbar-btn
.hero-unit             =>    .jumbotron
.icon-* 	           =>    .glyphicon .glyphicon-*
.btn 	                   =>    .btn .btn-default
.btn-mini 	           =>    .btn-xs
.btn-small 	           =>    .btn-sm
.btn-large 	           =>    .btn-lg
.visible-phone 	   =>    .visible-sm
.visible-tablet 	   =>    .visible-md
.visible-desktop 	   =>    .visible-lg
.hidden-phone 	   =>    .hidden-sm
.hidden-tablet 	   =>    .hidden-md
.hidden-desktop    =>    .hidden-lg
.input-small 	   =>    .input-sm
.input-large 	   =>    .input-lg
.checkbox.inline .radio.inline 	     =>    .checkbox-inline .radio-inline
.input-prepend .input-append 	     =>    .input-group
.add-on 	           =>    .input-group-addon
.thumbnail 	   =>    .img-thumbnail
ul.unstyled 	   =>    .list-unstyled
ul.inline 	           =>    .list-inline
ศึกษาเพิ่มเติมได้ที่
http://getbootstrap.com/getting-started/#migration
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 69