How to use bootstrap for font sizes?

Question

How to use bootstrap for font sizes?

Navigation

#1 by (1 votes)

2

I'd like a didactic answer on how to use Bootstrap to determine font sizes. To help, I'm using exactly the following half-queries:

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

}

/* Landscape phones and down */
@media (max-width: 480px) {

}

From what I understand, one should give a base size to transform px to em but to continue my work and my learning, I would like to be sure how to use this.

css twitter-bootstrap layout-responsivo

asked by anonymous 14.06.2014 / 21:25

1 answer

Upload Image using WebService C # XCode - array position value is not displayed

score 1 · Accepted Answer

As you said, the measure em is a relative measure, that is, it is calculated from a fixed "base" value. So you could do the following code:

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
    body{
        font-size:15px;
    }
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    body{
        font-size:25px;
    }
}

/* Landscape phones and down */
@media (max-width: 480px) {
    body{
        font-size:50px;
    }
}

And every time you assign the property font-size: [n]em (where [n] can be any value float > 0) to some element, it would have the font size according to the current media-query.

Example: FIDDLE