HTML | DOM 样式 fontSize 属性

fontSize 属性用于设置或获取单词中应出现的字符的字体大小。

句法：

• 它返回 fontSize 属性。

  object.style.fontSize
  

• 它设置 fontSize 属性。

  object.style.fontSize = "value|initial|inherit"
  

属性值：

Value	Description
xx-small x-small small medium large x-large xx-large	Predefine sizes of font
smaller	Decreases by one relative unit of the font-size
larger	Increases by one relative unit of the font-size
length	Font-size in length unit
%	% of the parent element’s font size
initial	Set default value
inherit	Inherit property from its parent value

返回值：返回元素文本的字体大小。

示例 1：将字体大小更改为小。

  

    DOM Style fontSize Property 

  

    
        
            GeeksForGeeks
        
  
        DOM Style fontSize Property 
        
        
            Click to change
        
  
        
            function myGeeks() {
                  
                
                //  Change font size in to small.
                document.getElementById(
               "Geek1").style.fontSize = "small";
            }
        
    

  

输出：

• 点击按钮前：
  
• 点击按钮后：
  

示例 2：将font-size 更改为 xx-large。

  

    DOM Style fontSize Property 

  

    
        
            GeeksForGeeks
        
  
        DOM Style fontSize Property 
        
        
            Click to change
        
  
        
            function myGeeks() {
                
                //  change into xx-large.
                document.getElementById(
                  "Geek1").style.fontSize = "xx-large";
            }
        
    

  

输出：

• 点击按钮前：
  
• 点击按钮后：
  

示例 3：使用长度单位更改字体大小。

  

    DOM Style fontSize Property 

  

    
        
            GeeksForGeeks
        
  
        DOM Style fontSize Property 
        
        
            Click to change
        
  
        
            function myGeeks() {
                
                //  Change font size from 
                //  from 10px to 30px
                document.getElementById(
                  "Geek1").style.fontSize = "30px";
            }
        
    

  

输出：

• 点击按钮前：
  
• 点击按钮后：
  

示例 4：使用 ‘%’ 更改字体大小

  

    DOM Style fontSize Property 

  

    
        
            GeeksForGeeks
        
  
        DOM Style fontSize Property 
        
        
            Click to change
        
  
        
            function myGeeks() {
                
                //  Change font-size from 100% to 200%
                document.getElementById(
                  "Geek1").style.fontSize = "200%";
            }
        
    

  

输出：

• 点击按钮前
  
• 点击按钮后
  

支持的浏览器： HTML支持的浏览器| DOM Style fontSize 属性列举如下：

• 谷歌浏览器
• IE浏览器
• 火狐浏览器
• 歌剧
• 苹果浏览器