使用 HTML 和 CSS 将发光效果应用于图像

在浏览大多数网站时，您会看到一些特殊效果，将光标放在各种图像上时可以看到这些效果。因此，在本文中，我们将实现相同的功能。我们可以将此类图像用作我们网站的卡片。

在本文中，您将学习如何将发光效果应用于特定图像，当您将光标放在它上面时，您将看到该效果。我们将使用HTML和CSS来实现它。提供了一个示例视频，以更清楚地了解您将在本文中开发的内容。

分步实施

第 1 步：图片的 HTML 代码：

HTML

  GeeksForGeeks Glowling Card


  
  

第 2 步：使用 CSS 设置图像样式：

现在，我们将应用一些 CSS 属性来装饰图像并修复它在网页上的位置。关键是当用户将光标放在图像上时，使用 CSS的 box-shadow 属性使图像发光。这是提供给您帮助的内部 CSS 代码。

HTML

例子：

此示例使用box-shadow属性将发光效果应用于图像。您可以根据自己的喜好更改背景发光颜色。

HTML

  

  
    

  

  
    
    

        GeeksForGeeks Glowling Card
    
    

        
        
    
  

  

这就是本文的全部内容。这是上述代码的输出视频。

输出：