更改正文中所有文本元素的字體大小

Question

我想允許用戶更改整個網頁的font-size 。

我已經在 rem 中設置了字體大小，我正在嘗試更改根的字體大小，以便它反映所有元素。

我的標記-

<body >

        <div id="test-text">
        ALL TEXT
        </div>
        <p>sample text</p>
        <p>sample text2</p>
        <span>sample text3</span>
        <h1>tst4</h1>
        <label>label</label>
<button id="inc">inc</button>
</body>

代碼-

$('#inc').click(function(){
    $('body').css('font-size','4rem !important');
})

CSS-

 p{
    font-size: 2rem;
  }

  span{
    font-size: 0.5rem;
  }

該代碼沒有反映任何內容。 我在這里缺少什么？

Answer 1

jQuery 並不總是識別!important 。 刪除!important它應該可以工作。

如何使用 .css() 應用 !important？

 $('#inc').click(function(){ $('body').css('font-size','4rem'); })

 p{ font-size: 2rem; } span{ font-size: 0.5rem; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="test-text"> ALL TEXT </div> <p>sample text</p> <p>sample text2</p> <span>sample text3</span> <h1>tst4</h1> <label>label</label> <button id="inc">inc</button>

更改正文中所有文本元素的字體大小

問題描述

1 個解決方案

解決方案1
3 已采納 2020-10-14 04:03:54

更改正文中所有文本元素的字體大小

問題描述

1 個解決方案

解決方案1 3 已采納 2020-10-14 04:03:54

解決方案1
3 已采納 2020-10-14 04:03:54