css - Bootstrap 响应式文本大小

标签 css twitter-bootstrap responsive-design

<分区>

我正在尝试使用 bootstrap 构建响应式布局,目前正在使用 font-size:3em 定义一些标题;

但是当布局缩小时,这就太大了。如何响应式地减小文本的大小?

最佳答案

最简单的方法是以 % 或 em 为单位使用维度。只需更改基本字体大小,一切都会改变。

较少

@media (max-width: @screen-xs) {
    body{font-size: 10px;}
}

@media (max-width: @screen-sm) {
    body{font-size: 14px;}
}


h5{
    font-size: 1.4rem;
}       

查看https://stackoverflow.com/a/21981859/406659的所有方法

您可以使用视口(viewport)单位(vh、vw...),但它们不适用于 Android <4.4

关于css - Bootstrap 响应式文本大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14537611/

相关文章:

html - 选择标签中的 Img 未在 Chrome 上显示

html - css 半星颜色

css - 根据条件更改图标的颜色

jquery - CSS 在浏览器中未处于事件状态时未更新?

css - 响应式等宽

html - Twitter Bootstrap 自定义主题 1200px/980px

html - Bootstrap 网格中的输入元素不会跨越整个宽度

php - css li 相互环绕(附图片)

css - Div 在浏览器调整大小时重叠

css - 当站点变窄时更改菜单 float (响应)