css实现注册表单步骤效果代码
代码语言:html
所属分类:表单美化
代码描述:css实现注册表单步骤效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> @import url(https://fonts.googleapis.com/css?family=Open+Sans:700,300); html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } html { line-height: 1; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } q, blockquote { quotes: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } a img { border: none; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } body { font-family: "Open Sans", sans-serif; font-size: 16px; text-align: center; color: #444; background: #d0d0d0; } header { margin-bottom: 2em; } h1 { font-size: 2em; margin: 2em 0 1em; } strong { font-weight: 700; } p { line-height: 1.4em; } article header { margin: 0; } .full-height { height: 26em; align-items: center; } .flexy-item { display: flex; flex-direction: row; justify-content: center; position: relative; } .flexy-column { flex-direction: column; } .flexy-column.reverse { flex-direction: column-reverse; } .flexy-item_child { flex: 1 0 100%; } .pure-steps { display: inline-block; width: 20em; color: white; margin-bottom: 3em; } .pure-steps strong { color: #B2FF41; font-weight: 300; } .pure-steps .pure-steps_group { position: relative; min-height: 26em; border-radius: .4em; overflow: hidden; box-shadow: 0 1.7em 5.5em -0.94em rgba(0, 0, 0, 0.3), 0 2em 3em 0.5em rgba(0, 0, 0, 0.1), 0 1.8em 2em -1.5em rgba(0, 0, 0, 0.2); background-image: linear.........完整代码请登录后点击上方下载按钮下载查看
网友评论0