1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-23 09:41:11 +00:00

adds a note on typography docs about rem units on font-size-base (#23988)

This commit is contained in:
Andres Galante 2017-10-02 18:59:07 -07:00 committed by Mark Otto
parent 2f459afb97
commit 0c03b70bcb

View File

@ -16,7 +16,7 @@ Bootstrap sets basic global display, typography, and link styles. When more cont
- Set the global link color via `$link-color` and apply link underlines only on `:hover`. - Set the global link color via `$link-color` and apply link underlines only on `:hover`.
- Use `$body-bg` to set a `background-color` on the `<body>` (`#fff` by default). - Use `$body-bg` to set a `background-color` on the `<body>` (`#fff` by default).
These styles can be found within `_reboot.scss`, and the global variables are defined in `_variables.scss`. These styles can be found within `_reboot.scss`, and the global variables are defined in `_variables.scss`. Make sure to set `$font-size-base` in `rem`.
## Headings ## Headings
@ -297,24 +297,24 @@ Here's an example of it in practice. Choose whatever `font-size`s and media quer
{% highlight scss %} {% highlight scss %}
html { html {
font-size: 14px; font-size: 1rem;
} }
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
html { html {
font-size: 16px; font-size: 1.2rem;
} }
} }
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
html { html {
font-size: 20px; font-size: 1.4rem;
} }
} }
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
html { html {
font-size: 28px; font-size: 1.6rem;
} }
} }
{% endhighlight %} {% endhighlight %}