javascript - Jquery txt 从当前 txt 大小调整大小，不起作用

Question

我在我的网站上添加了两个按钮来调整 txt 的大小:

<button id="grow">Make text Bigger</button>
<button id="shrink">Make text Smaller</button>

使用 Jquery 我尝试添加到当前的正文字体:

$(document).ready(function(){
  $("#grow").click(function(){
     $('body').css( "font", "x+=2" )
  });
});

$(document).ready(function(){
  $("#shrink").click(function(){
   $('body').css( "font", "x-=2" )
  });
});

这也是我的正文 css，如果有帮助的话:

body {
    background: #000;
    font: 12px Arial, Helvetica, sans-serif;
    line-height: 2em;
    padding: 0;
    margin: 0;
}

我进行了大量研究并以多种方式调整了代码，但没有运气。这不应该起作用吗？

Answer 1

DEMO

$("#grow").click(function () {
    $('body').css("font-size","+=2")
});
$("#shrink").click(function () {
    $('body').css("font-size", "-=2")
});