css实现悬浮圆顶打开动画效果代码
代码语言:html
所属分类:悬停
代码描述:css实现悬浮圆顶打开动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <style> /* ===================================================================== DEMO 2 ===================================================================== */ .circle { background: rgb(255,255,255); border-radius: 100%; cursor: pointer; position: relative; margin: 0 auto; width: 15em; height: 15em; overflow: hidden; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .circle h1 { color: rgba(189, 185, 199,0); font-family: 'Lato', sans-serif; font-weight: 900; font-size: 1.6em; line-height: 8.2em; text-align: center; text-transform: uppercase; -webkit-font-smoothing: antialiased; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: color 0.8s ease-in-out; -moz-transition: color 0.8s ease-in-out; -ms-transition: color 0.8s ease-in-out; transition: color 0.8s ease-in-out; } .circle:before, .circle:after { border-radius: 100%; content:""; position: absolute; top: 0; left:.........完整代码请登录后点击上方下载按钮下载查看
网友评论0