Có cần phải thêm bộ chọn col-md trong Bootstrap 3 không?

Question

Tôi đã cố gắng tìm kiếm câu trả lời cho điều này để không có kết quả. Về cơ bản những gì tôi tự hỏi là nếu nó là cần thiết để xác định một giá trị col-md- * trong Bootstrap 3, hoặc nếu bạn chỉ có thể sử dụng, nói, col-xs-12 và col-sm- * và có col-sm - * giá trị dictate col kích thước tất cả các cách để hiển thị một số lớn.

Điều này có vẻ như không có trí tuệ (có col-sm) nhưng tài liệu bao gồm các giá trị col-md- * dường như dư thừa, chẳng hạn như ở đây (được lấy từ "Ví dụ: Di động, Máy tính bảng và Desktop" dưới "Grid System" trong phần CSS:.!

<div class="row"> 
    <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div> 
    <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div> 
    <!-- Optional: clear the XS cols if their content doesn't match in height --> 
    <div class="clearfix visible-xs"></div> 
    <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div> 
</div> 

Bất kỳ làm rõ ở đây sẽ được đánh giá rất cám ơn

Answer 1

trực giác của bạn là đúng, giá trị thấp nhất bạn thiết lập (xs, sm hay md) sẽ dictate cho các kích thước màn hình lớn hơn, có nghĩa là nếu bạn muốn div của bạn để span 4 cột bắt đầu từ các thiết bị nhỏ và tất cả các con đường lên, bạn chỉ cần thiết lập .col-sm-4.

Nó hoạt động theo cách này vì cách thức truy vấn phương tiện truyền thông được thiết lập:

/* Extra small devices (phones, up to 480px) */ 
/* No media query since this is the default in Bootstrap */ 

/* Small devices (tablets, 768px and up) */ 
@media (min-width: @screen-tablet) { ... } 

/* Medium devices (desktops, 992px and up) */ 
@media (min-width: @screen-desktop) { ... } 

/* Large devices (large desktops, 1200px and up) */ 
@media (min-width: @screen-large-desktop) { ... } 

Nếu không ghi đè, lớp dành cho các thiết bị nhỏ sẽ áp dụng cho màn hình lớn hơn cũng