用CSS设计高体验的表单显示效果示例

【 tulaoshi.com - Html 】

以下是引用片段：
<style type="text/css" 
.input1{ 
font-family: verdana;background-color: #EEEEEE;border-bottom: #FFFFFF 1px solid;border-left: #CCCCCC 1px solid;border-right: #FFFFFF 1px solid;border-top: #CCCCCC 1px solid;font-size: 12px; 
} 
.input1-bor { 
font-family:verdana;background-color:#F0F8FF;font-size: 12px; 
border: 1px solid #333333;} 
</style 
<table cellspacing=2 cellpadding=0 width=300 border=0 
<tr 
<td<font class="en1"姓名:</font </td 
<td<input size=40 name=name class="input1" onblur="this.className=’input1’" onfocus="this.className=’input1-bor’" 
</td 
</tr 
<tr 
<td<font class="en1"邮箱:</font</td 
<td<input size=40 name=email class="input1" onblur="this.className=’input1’" onfocus="this.className=’input1-bor’"</td 
</tr 
<tr 
<td<font class="en1"网址:</font </td 
<td<input size=40 name=url class="input1" onblur="this.className=’input1’" onfocus="this.className=’input1-bor’" 
</td 
</tr 
<tr 
<td<font class="en1"主题:</font </td 
<td<input size=40 name=subject class="input1" onblur="this.className=’input1’" onfocus="this.className=’input1-bor’" 
</td 
</tr 
<tr 
<td<font class="en1"内容: </font </td 
<td<textarea name=message rows=5 cols=35 class="input1" onblur="this.className=’input1’" onfocus="this.className=’input1-bor’"</textarea</td</tr</table