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

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. bzoj5293: [Bjoi2018]求和

    题目链接 bzoj5293: [Bjoi2018]求和 题解 暴力 对于lca为1的好坑啊.... 代码 #include<cmath> #include<cstdio> #i ...

  2. Western Subregional of NEERC, Minsk, Wednesday, November 4, 2015 Problem A. A + B

    Problem A. A + B 题目连接: http://opentrains.snarknews.info/~ejudge/team.cgi?SID=c75360ed7f2c7022&al ...

  3. 使用 IntraWeb (17) - 基本控件之 TIWRadioButton、TIWRadioGroup、TIWCheckBox

    TIWRadioButton //单选 TIWRadioGroup //单选组 TIWCheckBox //复选 TIWRadioButton 所在单元及继承链: IWCompRadioButton. ...

  4. C# 判断字符编码的六种方法

    方法一http://blog.csdn.net/qiujiahao/archive/2007/08/09/1733169.aspx在unicode 字符串中,中文的范围是在4E00..9FFF:CJK ...

  5. .net core程序部署

    前期将一些程序切换到了.net core,本文这里记录下windows 下.net core程序部署相关的方法.有同样需求的朋友可以参考一下,以免少走一些弯路. .net core程序部署主要工作就是 ...

  6. 使用GIT进行源码管理——GIT托管服务2018

    我曾经介绍过几个在线的GIT托管服务,然而时过境迁,发生了不少变化,便写了此文章,在新的一年重新更新一下:   国外托管网站: 国外托管网站比起国内的来相对靠谱点,但一个主要缺点是网速较慢,并且可能在 ...

  7. ARM JTAG 调试原理

    ARM JTAG 调试原理 JTAG的接口是一种特殊的4/5个接脚接口连到芯片上 ,所以在电路版上的很多芯片可以将他们的JTAG接脚 通过Daisy Chain的方式连在一起,并且Probe只需连接到 ...

  8. cmsis dap interface firmware

    cmsis dap interface firmware The source code of the mbed HDK (tools + libraries) is available in thi ...

  9. Linux kernel AIO

    http://blog.csdn.net/abcd1f2/article/details/47440087

  10. google打不开怎么办?谷歌打不开的解决方法

    www.ggfwzs.com 我是在这里安装插件,安装后可以打开google http://jingyan.baidu.com/article/b907e627d67ad646e6891c52.htm ...