做了个输入框样式,如图:

CSS代码如下:

<喎�"http://www.2cto.com/kf/ware/vc/" target="_blank" class="keylink">vcD4KPHByZSBjbGFzcz0="brush:java;">#button { cursor:pointer; width:30%; margin:5px; padding:8px; border-radius:4px 4px 4px 4px; font-size:14px; font-weight:bold; } input{ transition:all 0.30s ease-in-out; -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; border:#364f86 1px solid; border-radius:3px; outline:none; } input:focus{ box-shadow:0 0 5px rgba(81, 203, 238, 1); -webkit-box-shadow:0 0 5px rgba(81, 203, 238, 1); -moz-box-shadow:0 0 5px rgba(81, 203, 238, 1); } textarea{ transition:all 0.30s ease-in-out; -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; border:#364f86 1px solid; border-radius:3px; outline:none; } textarea:focus{ box-shadow:0 0 5px rgba(81, 203, 238, 1); -webkit-box-shadow:0 0 5px rgba(81, 203, 238, 1); -moz-box-shadow:0 0 5px rgba(81, 203, 238, 1); } table代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<table>              
                <tbody><tr>
                    <td>用户名</td>
                    <td><input name="username" type="text" id="username" placeholder="用户名" style="height:25px">*</td>
                </tr>
                               
                <tr>
                    <td>联系方式</td>
                    <td><input name="contact" type="text" id="contact" placeholder="电话或邮件地址" style="height:25px">*</td>
                </tr>
 
                <tr>
                    <td>意见及建议</td>
                    <td><textarea name="comment" id="comment" rows="9" cols="112">0</textarea></td>
                </tr>              
                 
                <tr>
                <td colspan="2" align="center"><input type="submit" id="button" value="提交"></td>
                </tr>
</tbody></table>

漂亮的CSS3提交意见输入框样式的更多相关文章

  1. CSS3提交意见输入框样式

    做了个输入框样式,如图: CSS代码例如以下: #button { cursor:pointer; width:30%; margin:5px; padding:8px; border-radius: ...

  2. 36种漂亮的CSS3网页按钮Button样式

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  3. EasyNVR摄像机无插件直播流媒体服务器前端构建之输入框样式的调整

    EasyNVR授权方式分为软件的授权和硬件授权两种方式,软件授权需要在软件输入永久邀请码可以激化永久授权 起初我们的界面设计是为了满足功能的需求就是 ,用户可以输入激活码提交,完成永久授权. 在实际的 ...

  4. jQuery和CSS3炫酷GOOGLE样式的用户登录界面

    这是一款使用jQuery和CSS3打造的GOOGLE样式的用户登录界面特效.该登录界面特效中,右上角的小问号和错误提示小图标使用SVG来制作.username和password输入框採用浮动标签特效. ...

  5. 纯css3手机页面图标样式代码

    全部图标:http://hovertree.com/texiao/css/19/ 先看效果: 或者点这里:http://hovertree.com/texiao/css/19/hoverkico.ht ...

  6. Bounce.js – 快速创建漂亮的 CSS3 动画效果

    Bounce.js 是一个用于制作漂亮的 CSS3 关键帧动画的 JavaScript 库,使用其特有的方式生成的动画效果.只需添加一个组件,选择预设,然后你就可以得到一个短网址或者导出为 CSS 代 ...

  7. CSS3透明背景+渐变样式

    CSS3透明背景+渐变样式 转载自博文:<CSS3透明背景+渐变样式> http://blog.csdn.net/netbug_nb/article/details/44343809 效果 ...

  8. 精选 5 个漂亮的 CSS3 图片滑过特效

    这篇文章将为大家分享5款漂亮的CSS3图片滑过特效,比如滑过后显示图片的详细文字介绍,又比如滑过后对图片进行淡入淡出的效果等等.让我们一起来看看,喜欢的朋友赶紧收藏. 1.非常酷的CSS3图片说明效果 ...

  9. 认识CSS3新增选择器和样式

    前端之HTML5,CSS3(二) CSS3新增选择器和样式 CSS3新增选择器 结构伪类选择器 :first-child:选取父元素中的第一个子元素的指定选择器 :last-child:选取父元素中的 ...

随机推荐

  1. 【学习笔记】python2和python3的input()

    python2中的input()只接受变量作为传入值,非变量内容会报错. >>> user=input("Enter your name:") Enter you ...

  2. Spring 注解学习手札(七) 补遗——@ResponseBody,@RequestBody,@PathVariable(转)

    最近需要做些接口服务,服务协议定为JSON,为了整合在Spring中,一开始确实费了很大的劲,经朋友提醒才发现,SpringMVC已经强悍到如此地步,佩服! 相关参考: Spring 注解学习手札(一 ...

  3. 在eclipse中查看Android源码

    声明:高手跳过此文章 当我们在eclipse中开发android程序的时候.往往须要看源码(可能是出于好奇,可能是读源码习惯),那么怎样查看Android源码呢? 比方以下这样的情况 图1 如果我们想 ...

  4. USBDM Coldfire V2,3,4/DSC/Kinetis Debugger and Programmer -- MC9S08JS16

    Introduction The attached files provide a port of a combined TBLCF/DSC code to a MC9S08JS16 processo ...

  5. There are no packages available for install

    解决方法: ·删除sublime Text 安装目录下Data->Packages目录下的Package Control(如果没有,略过此步骤). ·下载Package Control,下载路径 ...

  6. spy++使用指南

    很多朋友都对窗口句柄比较迷糊,这篇短文就以spy++这个软件为主,介绍下窗体句柄和使用按键插件时,如果对这个句柄发送消息,即所谓的后台挂机.spy++这个软件来自VC++,装好VC后,就可以在工具中看 ...

  7. 根据twitter的snowflake算法生成唯一ID

    C#版本 /// <summary> /// 根据twitter的snowflake算法生成唯一ID /// snowflake算法 64 位 /// 0---0000000000 000 ...

  8. SystemParametersinfo的用法(一)

    SystemParametersinfo的用法(一) 函数功能:该函数查询或设置系统级参数.该函数也可以在设置参数中更新用户配置文件. 函数原型:B00L SystemParametersinfo(U ...

  9. SNK 与PFX

    snk 1用来证明这个生成的程序集是你发布的: 2如果你写的程序集要用在多个应用程序上的话,那么这个程序集必须要拥有唯一的名称,这个强名称是程序集唯一名称的一部分. 3只要你保护好你的snk文件不要公 ...

  10. Xamarin.Android,Xamarin.iOS, Linking

    Xamarin.Android applications use a linker in order to reduce the size of the application. The linker ...