The Bootstrap 3 grid system is based on how many columns?

The Bootstrap 3 grid system is designed around a 12-column layout, which allows for a highly flexible and responsive design framework. This structure enables developers to create complex layouts using simple classes while maintaining a consistent design across various screen sizes.

By dividing the layout into 12 columns, developers can easily combine these columns to create different configurations. For example, you can have a 3-column layout (3+3+3+3), or a 4-column layout (4+4+4), and so on, without exceeding the total of 12. This modularity is what makes Bootstrap's grid system powerful, as it supports responsiveness—adapting to various device widths by collapsing or expanding the columns accordingly. The use of 12 columns also aligns with many design principles, making it a common choice in modern web development frameworks.

In contrast, other options like 5, 6, or 10 do not provide the same level of versatility or compatibility with typical design needs; thus, they are not part of Bootstrap's foundational grid structure.