HTML | DOM 样式 textShadow 属性

HTML DOM 中的style textShadow属性用于设置文本的阴影效果。我们可以使用此属性设置多个阴影效果。此属性还可以返回文本的阴影效果。

句法：

• 它返回 textShadow 属性。

  object.style.textShadow

• 它用于设置 textShadow 属性。

  object.style.textShadow = "none|h-shadow v-shadow blur color|
  initial|inherit"

属性值：

• none：该属性不绘制阴影。这是一个默认值。
• h-shadow：用于定位水平阴影，它允许负值。这是必填字段
• v-shadow：用于定位垂直阴影，它允许负值。这是必填字段。
• 模糊：它是可选的，它指定模糊距离。
• color：它是可选的，用于指定阴影的颜色。
• 初始：它将 textShadow 属性设置为其默认值。
• 继承：此属性从其父元素继承。

返回值：

• 它返回表示元素的 textShadow 属性的阴影效果的逗号分隔列表的字符串。

示例 1：

  

    DOM Style textShadow Property 
    
  
    
  

  

  
    
         
                GeeksForGeeks 
            
        DOM Style textShadow Property 
        
         
          A Computer science portal for geeks
      
  
        
            Change Style
        
  
        
            function geeks() {
                
                //  Set textShadow in green color.
                document.getElementById(
                  "gfg").style.textShadow = 
                  "5px 5px 1px green";
            }
        
    

  

输出：

点击按钮前：

点击按钮后：

示例 2：

  

    DOM Style textShadow Property 
    
  
    
  

  

  
    
         
           GeeksForGeeks 
        
        DOM Style textShadow Property 
        
         
          A Computer science portal for geeks
        
  
        
            Shadow effect
        
  
        
            function geeks() {
                
                //  Set textShadow in magenta color.
                document.getElementById(
                  "gfg").style.textShadow = 
                  "-3px -5px 1px magenta";
            }
        
    

  

输出：

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

支持的浏览器： DOM Style textShadow属性支持的浏览器如下：

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