Mục đích của các lớp navbar và navbar-inner riêng biệt là gì?

Question

Trong khởi động-template.html Twitter bootstrap của, thanh điều hướng được viết như

<div class="navbar"> 
    <div class="navbar-inner"> 
    <div class="container"> 
    ... 
    </div> 
    </div> 
</div> 

Tuy nhiên, nếu tôi thay đổi đánh dấu để

<div class="navbar navbar-inner"> 
    <div class="container"> 
    ... 
    </div> 
</div> 

tất cả mọi thứ dường như làm việc tốt và không có sự khác biệt hình ảnh rõ rệt như xa như tôi có thể nói. Lý do có các lớp học navbar và navbar-inner riêng biệt được liên kết với hai div là gì? Tại sao không chỉ có một lớp học navbar kết hợp phong cách của cả hai?

Answer 1

Nó làm cho cấu trúc của tài liệu html của bạn rõ ràng và dễ đọc hơn. Lớp .navbar đặt vị trí (và có nội tuyến hiển thị mặc định) trong khi lớp navbar-inner bao bọc nội dung của vùng chứa này (bảng hiển thị). Thanh .navbar của bạn có thể chứa nhiều hơn một khối như thanh điều hướng bên trong.

Trong thứ bậc DOM-cấu trúc của bạn .navbar có mức độ tương tự như .container (chất lỏng) divs: