Question

我正在创建一个主要使用rem单位作为字体大小单位的网站，以及其他属性（宽度，高度，边距等）该网站的一个功能是#mainContent的大小更改，这是通过更改html标记中的font-size来完成的：

的CSS：

html, body {
    font-size: 100%;
}

的javascript：

$("#mainContent").mousewheel(function(event, delta, deltaX, deltaY) {
    var fontSize = parseInt(($("html").css("font-size")).match(/\d+/));
    if (deltaY > 0) { // if scroll up:
    $("html").css("font-size", ((fontSize * 1.2) / 16) * 100 + "%");
    }
    else if (deltaY < 0) { // if scroll down:
    $("html").css("font-size", ((fontSize * 0.8) / 16) * 100 + "%");
    }
});

问题在于，当重新调整#mainContent的大小时，即使我指定了它们的大小，bootstrap的导航栏大小（不是font-size）和模态字体大小也会改变，因此它们不会受到影响：

.container-full {
    font-size: 100%;
}

如何确保只有#mainContent受影响而不是所有其他元素？感谢

在twitter bootstrap中使用em和rem font-size

0 个答案: