Javascript 如何统一更改字体大小？

如果我有以下HTML：

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

---

div2

和

div3

有自己的CSS，定义了字体大小等。有没有办法统一减小

div1

的字体大小？也就是说，取

div2

和

div3

中定义的字体大小，并将它们减小为

2px

？这类似于你如何使用css做

selectall->Ctrl+Shift+，我不认为你可以用css做这件事，但是如果有人知道你有多好心的话，也可以教我

我能想到的唯一解决方案是嵌套它们，这样带有div2和div3的元素就不会受到影响，这只会影响嵌套在div1元素下的div2和div3

    div.div2 { font-size:14px; }
    div.div3 { font-size:12px; }

    div.div1 div.div2 { font-size:12px; }
    div.div1 div.div3 { font-size:10px; }

如果使用百分比或em设置字体大小，则可以，但不能使用像素。在下面的示例中，如果更改div1字体大小，将同时影响div2和div3。有关字体大小单位类型的比较，请参阅本文

以下是我在网站中设置字体大小的方法：

/* percentage to px scale (very simple)
 80% =  8px
100% = 10px
120% = 12px
140% = 14px
180% = 18px
240% = 24px
260% = 26px
*/

body
{
    font-family: Arial, Helvetica, sans-serif;
    font-size:10px;
}

通过像body元素那样设置字体大小属性，将其他所有内容的字体大小设置为100%=10px就变得很简单了。这也使得使用库变得更加容易，因为它们使用相同的字体大小设置。
如果您在
ems
中设置内部div的字体大小，那么就很简单了。如果你有这个

.div2 {
    font-size: 1.8em; /*180% of inherited font-size */
}

.div3 {
    font-size: 1.4em; /*140% of inherited font-size */
}

。。。然后，如果更改div1的
font size
，则.div2和.div3的
font size
s将按比例更改。
javascript的基本思想：

var divs = document.getElementsByTagName('div');
for(int i = 0; i < divs.Length; ++i) {
  var element = divs[i];
  element.style.setAttribute('font-size', '2px');  //whatever you need to set it to
}

var divs=document.getElementsByTagName（'div'）；
对于（int i=0；i

上面的内容将改变每个div的字体大小。显然，这可能不太适合您。。。但是您可以做一些事情来修改代码。您可以使用
document.getElementById（'id'）获取顶级div然后在子节点上设置样式
我想这就是您想要的：

演示：

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>​

​
 javascript是一种选择，还是你只想使用CSS来实现这一点？@Borophyll:当然。我不明白为什么不。刚刚编辑了我的问题。您需要将
div1
的
font size
设置为类似
16px
的绝对长度。如果不
div1
将继承其父级的
字体大小（如果未设置，则依赖于用户的浏览器默认值）。明白我在这里的意思了吧：也明白这个@flackend的优点。我倾向于将其留给浏览器默认字体大小，在我的经验中，这种默认字体大小在所有方面都几乎相同（至少在跨浏览器测试时，我从未注意到任何不合理的字体大小）。将来要记住的事情though@flackend-我已根据您在评论中指出的内容修改了我的答案。
<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>​

$(".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;
}