织梦CMS - 轻松建站从此开始!

文档之家-IT技术文档共享平台

CSS3 创建漂亮的表单(2) 基本样式和阴影

时间:2010-12-03 06:09来源:docfans.net 作者:admin 点击:
CSS3 创建漂亮的表单(2) 基本样式和阴影

前面一篇中,我们了解了这次的目标及表达代码;今天继续,来看下表单元素基本的样式设置以及CSS3阴影样式方 面的应用。

基础样式设置包括表单元素的呈现、文字样式等方面,比较常规。

 

[css]
input, textarea {
padding: 9px;
border: solid 1px #E5E5E5;
outline: 0;
font: normal 13px/100% Verdana, Tahoma, sans-serif;
width: 200px;
background: #FFFFFF;
}

textarea {
width: 400px;
max-width: 400px;
height: 150px;
line-height: 150%;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
border-color: #C9C9C9;
}

.form label {
margin-left: 10px;
color: #999999;
}

.submit input {
width: auto;
padding: 9px 15px;
background: #617798;
border: 0;
font-size: 14px;
color: #FFFFFF;
}
[/css]

做好这一步其实已经是个中规中距的常规表单的模样了;沿袭了近年来的风格习俗。

(责任编辑:eric)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
栏目列表
推荐内容