Form 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 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>
<style type="text/css">
<!--
.en1 {font-size:10px;font-family:Verdana
}
.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;
}
.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">&nbsp;</td>
<td width="400"><input size=40 name=name class="input1" onblu
r="this.className='input1'" onfocus="this.className='input1-
bor'"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input size=40 name=name class="input1" onblur="this.clas
sName='input1'" onfocus="this.className='input1-bor'"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input size=40 name=name class="input1" onblur="this.clas
sName='input1'" onfocus="this.className='input1-bor'"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input size=40 name=name class="input1" onblur="this.clas
sName='input1'" onfocus="this.className='input1-bor'">
;</td>
</tr>
</table>
</form>