css实现简约404页面带悬浮效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现简约404页面带悬浮效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css"> <style> @import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500); body { background-color: #007aff; color: #fff; font-size: 100%; line-height: 1.5; font-family: "Roboto", sans-serif; } .button { font-weight: 300; color: #fff; font-size: 1.2em; text-decoration: none; border: 1px solid #efefef; padding: 1em; border-radius: 3px; margin-top:10%; margin-left:40%; transition: all .3s linear; position:absolute; } .button:hover { font-weight: 300; color: fff; background-color: #008aff; font-size: 1.2em; text-decoration: none; border: 1px solid #efefef; padding: 1em; border-radius: 3px; margin-top:10%; margin-left:36%; transition: all .3s linear; position:absolute; -webkit-transition:all .2s; -webkit-transition-timing-function:gradient; } p { font-size: 2em; text-align: center; font-weight: 100; } p:hover { font-size: 2.2em; text-align: center; font-weight: 100; color:lightgray; -webkit-transition:all .3s; -webkit-transition-timing-function:gradient; text-shadow: rgb(0, 97, 204) 1px 1px, rgb(0, 97, 204) 2px 2px, rgb(0, 97, 204) 3px 3px, rgb(0, 97, 205) 4px 4px, .........完整代码请登录后点击上方下载按钮下载查看
网友评论0