css - 将自定义文本类添加到 Twitter Bootstrap 时保持响应能力

标签 css twitter-bootstrap responsive-design

我正在尝试添加我自己的名为“article-title”的类,它比 twitter bootstrap 的默认 H1 字体大小大得多。

有人可以概述需要采取哪些步骤来保持响应速度吗?我想确保在较小的屏幕上文本适当缩小。

谢谢

最佳答案

使用媒体查询并根据屏幕大小更改字体大小

例如,当您的屏幕尺寸为 320 像素或以下时,此媒体查询会更改字体大小:

@media (max-width: 320px) {
    .article-title { font-size: 2em; }
}

上面的示例在下面的堆栈问题中演示

Responsive Font Size

祝你好运

关于css - 将自定义文本类添加到 Twitter Bootstrap 时保持响应能力,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22124316/

相关文章:

css - 用 CSS 模拟边框

javascript - 在 JavaScript 中,如何确定与给定 CSS 选择器匹配的所有元素都将与另一个给定 CSS 选择器匹配?

html - 创建带有箭头的响应式 CSS 按钮

javascript - 响应式 jQuery 或 JavaScript 框架

css - Myspace 音乐排版问题

css - CSS 显示属性的过渡

javascript - 如何使用最新的 typeahead.js 库呈现 JSON 响应

html - li span 没有左对齐

css - Bootstrap 4 输入组框阴影

javascript - jQuery:当窗口宽度匹配数组中的任何值时触发函数