很漂亮的CSS提交表单，大家先看看

CSS代码：

CSS Code 复制内容到剪贴板 body { padding:50px 100px; font:13px/150% Verdana, Tahoma, sans-serif; }       /* tutorial */       input, textarea {       padding :  9px ;      border :  solid   1px   #E5E5E5 ;      outline : 0;      font :  normal   13px /100%  Verdana ,  Tahoma ,  sans-serif ;      width :  200px ;      background :  #FFFFFF   url ( 'bg_form.png' )  left   top   repeat -x;      background : -webkit-gradient(linear,  left   top ,  left  25, from( #FFFFFF ),  color -stop(4%,  #EEEEEE ), to( #FFFFFF ));      background : -moz-linear-gradient( top ,  #FFFFFF ,  #EEEEEE   1px ,  #FFFFFF   25px );     box-shadow: rgba(0,0,0, 0.1)  0px   0px   8px ;     -moz-box-shadow: rgba(0,0,0, 0.1)  0px   0px   8px ;     -webkit-box-shadow: rgba(0,0,0, 0.1)  0px   0px   8px ;     }       textarea {       width :  400px ;      max-width :  400px ;      height :  150px ;      line-height : 150%;     }       input:hover, textarea:hover,    input:focus, textarea:focus {       border-color :  #C9C9C9 ;      -webkit-box-shadow: rgba(0, 0, 0, 0.15)  0px   0px   8px ;     }       .form label {       margin-left :  10px ;       color :  #999999 ;      }       .submit input {      width :  auto ;      padding :  9px   15px ;      background :  #617798 ;      border : 0;      font-size :  14px ;      color :  #FFFFFF ;     -moz- border -radius:  5px ;     -webkit- border -radius:  5px ;     }   

html代码:

XML/HTML Code 复制内容到剪贴板 <!DOCTYPE>   < html   xmlns = "http://www.w3.org/1999/xhtml" >    < head   profile = "http://gmpg.org/xfn/11" >    < title > CSS3 Form Demo </ title >    < meta   http-equiv = "Content-Type"   content = "text/html; charset=UTF-8"   />    < link   rel = "stylesheet"   href = "demo.css"   type = "text/css"   media = "all"   />    </ head >    < body >    < form   class = "form" >       < p   class = "name" >         < input   type = "text"   name = "name"   id = "name"   />         < label   for = "name" > Name < span > 图 </ span > < i > 库 </ i > </ label >       </ p >       < p   class = "email" >         < input   type = "text"   name = "email"   id = "email"   />         < label   for = "email" > E-mail < span > 图 </ span > < i > 库 </ i > </ label >       </ p >       < p   class = "web" >         < input   type = "text"   name = "web"   id = "web"   />         < label   for = "web" > Website < span > 图 </ span > < i > 库 </ i > </ label >       </ p >       < p   class = "text" >         < textarea   name = "text" > </ textarea >       </ p >       < p   class = "submit" >         < input   type = "submit"   value = "Send"   />       </ p >    </ form >          </ body >    </ html >   

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。