javascript - 如何统一更改字体大小？

Question

如果我有以下 HTML:

<div class="div1">
   <div class="div2">
   </div>
   <div class="div3">
   </div>
</div>

div2和 div3有自己的 CSS，定义了字体大小等。有没有办法可以减小 div1 的字体大小？统一？即取div2中定义的字体大小和 div3并通过说 2px 来减少它们？这类似于您的操作 Select All -> Ctrl + Shift + <在文字处理软件中将所选文本的大小缩小 1 磅。有什么建议吗？

Answer 1

我想这就是你想要的:

演示:http://jsfiddle.net/SO_AMK/JjutY/

HTML:

<div class="div1">
   <div class="div2">
       Some text, and more, and more, and more, and more, and more, and more, and more, and more.
   </div>
   <div class="div3">
       Some text, and more, and more, and more, and more, and more, and more, and more, and more.
   </div>
    <button class="increaseFontSize">Increase Font Size</button>
</div>​

jQuery:

$(".increaseFontSize").click(function(){
        var fontSize = getFontSize($(".div3"));
        var newFontSize = fontSize + 2;
        $(".div3").css("font-size", newFontSize);
        return false;
});
function getFontSize(element) {
    var currentSize = $(element).css("font-size");
    var currentSizeNumber = parseFloat(currentSize);
    return currentSizeNumber;
}