Form Liên hệ nổi lên khi trỏ dấu nháy vàoHiệu ứng đẹp cho form liên hệ.
Trang 1Form Liên hệ nổi lên khi trỏ dấu nháy vào
Hiệu ứng đẹp cho form liên hệ
Chỉ cần vài dòng CSS là ok
demo : http://hoangth.webdoanhnghiep.org/3/
Bước 1 : CSS - Copy đoạn code bên dưới vào dán vào thẻ head
PHP Code:
<style type="text/css">
body{
font-family: verdana,font-size: 12px;color: #FFFFFF;background-color:#ffffff}
.en1 {
font-size: 10px;font-family: Verdana
}
.input1{
font-family: verdana;background-color:
#EEEEEE;border-bottom: #FFFFFF 1px 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>
<style type="text/css">
<! .en1 {font-size: 10px;font-family: Verdana
}
.input1 {font-family: verdana;background-color: #EEEEEE;border-bottom: #FFFFFF 1px left: #CCCCCC 1px solid;border-right: #FFFFFF 1px solid;border-top: #CCCCCC 1px
solid;font-size: 12px;
}
.style2 {color: #000000}
>
</style>
Bước 2: Chèn hiệu ứng cho text field
PHP Code:
<input size=40 name=name class="input1" onblur="this.className='inp ut1'" onfocus="this.className='input1-bor'">
Code mẫu
PHP Code:
<form id="form1" name="form1" method="post" action="">
<table width="500" border="0" cellspacing="0" cellpadding="0"> <tr>
<td colspan="2"><span class="style2">Lien He</span></td> </tr>
<tr>
<td width="100"> </td>
Trang 2<td width="400"><input size=40 name=name class="input1" onblu
r "this.className='input1'" onfocus=
"this.className='input1-bor'"></td>
</tr>
<tr>
<td> </td>
<td><input size=40 name=name class="input1" onblur="this.clas sName='input1'" onfocus="this.className='input1-bor'"></td>
</tr>
<tr>
<td> </td>
<td><input size=40 name=name class="input1" onblur="this.clas sName='input1'" onfocus="this.className='input1-bor'"></td>
</tr>
<tr>
<td> </td>
<td><input size=40 name=name class="input1" onblur="this.clas sName='input1'" onfocus="this.className='input1-bor'">
;</td>
</tr>
</table>
</form>