.glow-button { display: inline-block; padding: 12px 30px; font-size: 20px; color: #fff; background-color: #222; border: none; border-radius: 5px; box-shadow: 0 0 10px #fff; transition: all 0.3s ease-in-out; } .glow-button:hover { box-shadow: 0 0 20px #fff; }
以上代码是一个简单的CSS样式,可以用来制作一个发光的按钮。该样式定义了按钮的一些基本属性,如颜色、大小、边框等,同时添加了一个box-shadow(阴影)属性来模拟发光效果。当用户将鼠标悬停在按钮上时,box-shadow的值将发生改变,从而产生闪烁的发光效果。
在实际应用中,可以根据需要来修改按钮的样式,比如改变字体、背景颜色等。同时,可以给按钮添加一些动画效果,让用户的交互体验更加生动有趣。
总之,通过简单的CSS样式,大家可以轻松地制作出各种样式炫酷、功能强大的按钮。希望大家能够善于利用CSS技术,打造出更加优秀的Web设计作品。