div+css实现炫酷按钮悬浮动画效果代码
代码语言:html
所属分类:悬停
代码描述:div+css实现炫酷按钮悬浮动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> :root{ /* color type A */ --line_color : #555555 ; --back_color : #FFECF6 ; /* color type B */ /* --line_color : #1b1919 ; --back_color : #E9ECFF ; */ /* color type C */ /* --line_color : #00135C ; --back_color : #DEFFFA ; */ } .button{ position : relative ; z-index : 0 ; width : 240px ; height : 56px ; text-decoration : none ; font-size : 14px ; font-weight : bold ; color : var(--line_color) ; letter-spacing : 2px ; transition : all .3s ease ; } .button__text{ display : flex ; justify-content : center ; align-items : center ; width : 100% ; height : 100% ; } .button::before, .button::after, .button__text::before, .button__text::after{ content : '.........完整代码请登录后点击上方下载按钮下载查看
网友评论0