按钮无疑是任何网站或应用程序中最重要的组件之一。按钮的设计方式应使其从其他组件中脱颖而出，这样用户就可以清楚地了解单击的位置以及按钮的用途。按钮的样式有无数种方式。我们将研究如何创建一个闪亮的按钮。你们可能都见过光从一端移动到另一端，并在光亮的表面上反射。我们将在鼠标悬停时实现同样的功能。
方法：方法是在选择器之前和之后使用伪选择器。使用 before 我们将制作条状效果，使用 after 我们将确保它来回移动给它一种反射的外观，使我们的按钮看起来很闪亮。
HTML 代码：在本节中，我们创建了一个按钮。
Gradient Text
CSS 代码：对于 CSS，请按照以下给出的步骤操作。
- 第 1 步：首先做一些基本的按钮样式，比如背景部分和边框半径。
- 第 2 步：现在使用 inset shadow 属性为按钮的边框内部添加阴影。
- 第 3 步：现在使用 before 选择器创建一个条。诀窍是使用宽度小于按钮的实际宽度和高度等于按钮的实际高度。 skew函数的使用完全是可选的，如果你想可以跳过。我们已经用它来制作一个稍微倾斜的条带。
- 第 4 步：现在使用悬停将条带向左移动。
- 第 5 步：重复第 3 步和第 4 步，使用 after 选择器只需将宽度更改为负值即可将条带移回其原始位置。
提示：您可以使用一些行距和长度间距在按钮文本周围留出一些空间，使其看起来更清晰。
完整代码：是以上两段代码的组合。
Gradient Text
输出： 