| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293 |
- Overview
- ===============================================================================
- .. lead::
- Get the lowdown on the key pieces of Bootstrap's infrastructure, including
- our approach to better, faster, stronger web development.
- HTML5 doctype
- -------------
- Bootstrap makes use of certain HTML elements and CSS properties that require
- the use of the HTML5 doctype. Include it at the beginning of all your projects.
- .. code:: html
- :class: highlight
- <!DOCTYPE html>
- <html lang="en">
- ...
- </html>
- Mobile first
- -------------
- With Bootstrap 2, we added optional mobile friendly styles for key aspects of
- the framework. With Bootstrap 3, we've rewritten the project to be mobile
- friendly from the start. Instead of adding on optional mobile styles, they're
- baked right into the core. In fact, **Bootstrap is mobile first**. Mobile first
- styles can be found throughout the entire library instead of in separate files.
- To ensure proper rendering and touch zooming, **add the viewport meta tag** to
- your :code:`<head>`.
- .. code:: html
- :class: highlight
- <meta name="viewport" content="width=device-width, initial-scale=1">
- You can disable zooming capabilities on mobile devices by adding
- :code:`user-scalable=no` to the viewport meta tag. This disables zooming,
- meaning users are only able to scroll, and results in your site feeling a bit
- more like a native application. Overall, we don't recommend this on every site,
- so use caution!
- .. code:: html
- :class: highlight
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
- Typography and links
- --------------------
- Bootstrap sets basic global display, typography, and link styles. Specifically,
- we:
- * Set :code:`background-color: #fff`; on the body
- * Use the :code:`@font-family-base`, :code:`@font-size-base`, and
- :code:`@line-height-base` attributes as our typographic base
- * Set the global link color via :code:`@link-color` and apply link underlines
- only on :hover
- These styles can be found within :code:`scaffolding.less`.
- Normalize.css
- -------------
- For improved cross-browser rendering, we use `Normalize.css
- <http://necolas.github.io/normalize.css/>`_, a project by `Nicolas Gallagher
- <https://twitter.com/necolas>`_ and `Jonathan Neal <https://twitter.com/jon_neal>`_.
- Containers
- ----------
- Easily center a page's contents by wrapping its contents in a
- .container. Containers set width at various media query breakpoints to match
- our grid system.
- Note that, due to padding and fixed widths, containers are not nestable by
- default.
- .. code::
- :class: highlight
- .. container::
- ...
|
