如何删除应用的 CSS 转换？

在本文中，我们将学习如何移除应用的 CSS 转换。 CSS transform 属性用于对元素应用二维或三维变换。此属性可用于旋转、缩放、移动甚至倾斜元素。

句法：

transform: value;

为了移除应用的 CSS 转换，我们将使用 JavaScript。当我们单击按钮时使用 JavaScript 它将从元素中删除该类。下面是上述方法的完整实现。

示例：1

HTML

  

  
  
  
  
    .parent {
      background-color: yellow;
      margin: 5% auto;
    }
    /* Transition applied */
    .transition_apply {
      transform: rotateY(180deg);
    }
  

  

  
    
      GeeksforGeeks
    
  
    
      Click me
    
  
  
  
    // When click on button this function is involked
    $(".element").on("click", function () {
  
      // If class is transition_apply then 
      if ($(".transition_apply").hasClass("transition_apply")) {
          
        // remove this class to remove transition
        $(".transition_apply").removeClass("transition_apply");
      }
    });
  

  

输出：

• 在点击按钮之前：

  

• 点击按钮后：

  

示例 2：

HTML

  

  
  
  
  
  
    .parent {
      background-color: yellow;
      margin: 5% auto;
      color: green;
    }
    /* Transition applied rotate in x-axis */
    .transition_apply {
      transform: rotateX(-180deg);
    }
  

  

  
    
      GeeksforGeeks
    
    
      Click me
    
  
  
  
    // When click on button this function is involked
    $(".element").on("click", function () {
  
      // If class is transition_apply then 
      if ($(".transition_apply").hasClass("transition_apply")) {
          
        // remove this class to remove transition
        $(".transition_apply").removeClass("transition_apply");
      }
      else{
        // Add class
        $(".gfg").addClass("transition_apply");
      }
    });
  

  

输出：

• 在点击按钮之前：

  

• 点击按钮后：