Home > Web Front-end > HTML Tutorial > 基于CSS3 登录表单 个性化登录按钮_html/css_WEB-ITnose

基于CSS3 登录表单 个性化登录按钮_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:26:43
Original
1242 people have browsed it

这是一款基于jQuery和CSS3的登录表单,登录表单的界面整体呈现扁平化风格,非常简洁和清新。当焦点在表单的输入字段上时,表单提示文字会出现一个小动画,同时这款CSS3登录表单的最大特点是其个性化的登录按钮,鼠标滑过也有不错的效果。

在线预览    源码下载

实现的代码。

html代码:

<div class="panel-lite">  <div class="thumbur">    <div class="icon-lock"></div>  </div>  <h4>用户登录</h4>  <div class="form-group">    <input required="required" class="form-control"/>    <label class="form-label">用户名    </label>  </div>  <div class="form-group">    <input type="password" required="required" class="form-control"/>    <label class="form-label">密 码</label>  </div><a href="#">忘记密码 ?  </a>  <button class="floating-btn"><i class="icon-arrow"></i></button></div>
Copy after login

via:http://www.w2bc.com/article/css3-login-form-pretty-button

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template