form注册表单圆角

<BODY>
<div class="form">
<ul class="list">
<li>
<label>用户名:</label>
<div class="circle-box user">
<input type="text" placeholder="5之6位字母或数字组合"/>
</div>
</li>
<li>
<label>用户名:</label>
<div class="circle-box user">
<input type="text" value="一路小串走向胜利" onfocus="this.value=''"
onblur="if(this.value==''){this.value='一路小串走向胜利'}" class="value"/>
</div>
</li>
</ul>
</div>

</BODY>

============================

.form {
width: 600px;
height: 600px;
margin: 100px auto;
background: #FBFBFB;
border: 1px transparent dashed;
}
.list {
width: 550px;
margin: 20px auto;
}
.list li {
width: 550px;
height: 40px;
margin-top: 15px;
}
.list label {
width: 110px;
height: 40px;
display: inline-block;
font-size: 16px;
line-height: 40px;
text-align: right;
float: left;
margin-right: 20px;
}
.list .circle-box {
width: 320px;
height: 40px;
border: 1px #D9D9D9 solid;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
float: left;
}
.list .user {
background: url(../images/img50.png) no-repeat left center;
}
.list input{
width: 266px;
height: 36px;
line-height:36px\9;
margin-left: 47px;
margin-top: 1px;
border: none;
font-size: 16px;
padding-left: 6px;
}
.list .value{
color: #A9A9A9;
}

============================

form注册表单圆角 demo的更多相关文章

  1. 基于HTML5手机登录注册表单代码

    分享一款基于HTML5手机登录注册表单代码.这是一款鼠标点击注册登录按钮弹出表单,适合移动端使用.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&qu ...

  2. CSS3制作分步注册表单

    这个DEMO是使用CSS3制作的一个分步注册表单,每个input对应的是每一步,在表单得到焦点时,对应的step也会进行对应的改变.不过这个效果是使用js代码来实现,但整个表单的外观是由CSS3来完成 ...

  3. layui模板注册表单

    今天晚上用layui模板做了一个简单的注册表单,功能主要有可以js验证密码重复,可以验证手机号码. 这是界面 下面是我的html文件代码 <!DOCTYPE html> <html ...

  4. Html注册表单示例

    注册表单示例,出自<网页开发手记:Html,CSS,JavaScript实战详解>.   <html>   <head>   <title>注册表单&l ...

  5. 免费 PSD 下载： 20个精美的登录和注册表单

    注册表单有许多不同的形状和尺寸,有的只是单个的输入框,有的则需要多个步骤.登录表单的设计将定义网站的性质,因此它应进行针对性的设计.下面的列表提供了20个醒目的登录和注册表单设计为您提供灵感. 您可能 ...

  6. 如何利用WordPress创建自定义注册表单插件

    来源:http://www.ido321.com/1031.html 原文:Creating a Custom WordPress Registration Form Plugin 译文:创建一个定制 ...

  7. HTML6注册表单输入日志标题

    一.找到元素. var d = document.getElementById("") var d = document.getElementsByName("" ...

  8. 阻止form空表单提交----JavaScript

    网上看到很不错的阻止form空表单提交 第一种方法 <div class="warp"> <h2>登录到pfan空间</h2> <p> ...

  9. 4.前端注册表单验证 && 表单回填

    表单验证 前端表单验证就是在 jsp 页面中添加验证逻辑,使得注册表单在传入后台之前先进行一次表单验证 在jsp文件里的 head 块里面添加 jQuery 代码 <script type=&q ...

随机推荐

  1. java 邮件发送的公共方法

    protected static String host = "true"; protected static String auth = "smtp.163.com&q ...

  2. 数据结构与算法（C/C++版）【树与二叉树】

    第六章<树与二叉树> 树结构是一种非线性存储结构,存储的是具有"一对多"关系的数据元素的集合. 结点: A.B.C等,结点不仅包含数据元素,而且包含指向子树的分支.例如 ...

  3. Linux多线程编程——线程的创建与退出

    POSIX线程标准:该标准定义了创建和操纵线程的一整套API.在类Unix操作系统(Unix.Linux.Mac OS X等)中,都使用Pthreads作为操作系统的线程.Windows操作系统也有其 ...

  4. 浅谈 Integer 类

    在讲解 Integer 之前,我们先看下面这段代码: public static void main(String[] args) { Integer i = 10; Integer j = 10; ...

  5. 两个linux之间拷贝文件及文件夹

    Linux为我们提供了两个用于文件copy的命令.一个是cp,一个是scp,可是他们略有不同,cp 主要是用于在同一台电脑上,在不同的文件夹之间来回copy文件 scp 主要是在不同的Linux系统之 ...

  6. PMP杂谈--PMP中一些easy忽视的地方

    识别干系人:这个过程是持续的,在整个项目的生命周期中都要持续识别干系人. 组织过程资产和事业环境因素:这两个东西在过程的输入中似乎常常看到,但有时候又看不到,不要纠结了 ,不要浪费脑细胞去背诵哪个有, ...

  7. cxf,两个声明导致 ObjectFactory 类中发生冲突

    说明先,这里不管是client还是server端都是用java语言编写,如有写得不好,望原谅! 问题 http://localhost:8080/WEB-SMVC/cxf/userService?ws ...

  8. Eclipse背景颜色改动

     Eclipse背景颜色改动:  操作界面默认颜色为白色. 对于我们长期使用电脑编程的人来说.白色非常刺激我们的眼睛,所以我常常会改变workspace的背景色.使眼睛舒服一些.设置方法例如以下: ...

  9. xcode 6 改动组织及开发人员

    搞个ios 开发死去活来的,各个地方说的都不一样,defaults write 不好用 在xcode6中 改动方法例如以下 改动create by __FULLUSERNAME___ 部分 Syste ...

  10. 基于Office 365的随需应变业务应用平台

    作者:陈希章 发表于 2017年9月7日 这是我去年10月底在微软技术大会(Microsoft Ignite 2016) 上面的演讲主题,承蒙大家抬爱,也沾了前一场明星讲师的光,我记得会场几乎是满座. ...