- Mastering Bootstrap 4（Second Edition）
- Benjamin Jakobus Jason Marah
- 400字
- 2021-06-24 19:25:51
The grid system
Bootstrap's grid system is arguably its most impressive and most commonly used feature, as it solves the important task of horizontal and vertical positioning of a page's contents, allowing the contents to be structured across multiple display widths. Therefore, mastering this core functionality is essential for any Bootstrap developer.
As already noted in Chapter 1, Revving Up Bootstrap, Bootstrap 4 is mobile-first. As such, it should come as no surprise that the grid system is optimized for smaller viewports, and it scales up to suit larger viewports (as opposed to scaling down to smaller viewports).
A viewport is the available display size to render the contents of a page, that is, it refers to your browser window, minus the toolbars and scrollbars. The viewport should not be confused with the viewport meta tag, which is used to define the viewport's actual display size. To elaborate, as already noted in Chapter 1, Revving Up Bootstrap, mobile devices may indicate their viewport to be larger than it actually is in order to allow for the display of websites that have not been optimized for display on mobile devices. As a consequence, websites that take mobile viewports into consideration may often not render as intended. As a remedy, the viewport meta tag was introduced by Apple on iOS (and has since been uniformly adopted by all other major browsers) in order to allow websites to circumvent this problem by allowing developers to explicitly define the intended display size.
The grid composing the grid system is a structure that consists of three distinct, but fundamentally linked, parts: an all—encapsulating container split into horizontal rows that are themselves split into 12 equal columns (refer to Figure 2.1). In the following subsections, we will take an in-depth look at the three building blocks of Bootstrap's grid system:
- Linux設備驅動開發詳解（第2版）
- PLC控制程序精編108例
- 嵌入式Linux系統開發：基于Yocto Project
- 精解Windows 8
- SharePoint 2013 應用開發實戰
- Linux操作系統應用編程
- Alfresco 4 Enterprise Content Management Implementation
- Learning Bootstrap
- 蘋果OS X Mavericks 10.9應用大全
- Distributed Computing with Go
- 新編電腦辦公（Windows 10+ Office 2013版）從入門到精通
- VMware vSphere 5.1 Cookbook
- Android NDK Beginner's Guide
- 操作系統之哲學原理第2版
- Xamarin Mobile Application Development for Android