display:block与display:inline-block在input中的使用区别
时间:2010-02-02 20:37来源:未知 作者:admin 点击:次
inline:内联对象的默认值。将对象强制作为内联对象呈递，从对象中删除行 display:inline-block; 将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行
inline:内联对象的默认值。将对象强制作为内联对象呈递，从对象中删除行
display:inline-block; 将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内
display:block; 块对象的默认值。将对象强制作为块对象呈递，为对象之后添加新行
举例说明：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="JavaScript">
function clickbutton(){
if (document.all.showBill.value=="查询")
{
document.all.address.style.display="inline-block";
document.all.showBill.value="隐藏";
}else{
document.all.showBill.value="查询";
document.all.address.style.display="none";
}
}
</script>
</HEAD>
<BODY>
<form>
<table>
<tr>
<td nowrap>
<input name="name" type="text" >
<input name="address" type="text" style=display:"none">
</td>
</tr>
<tr>
<input name="showBill" class=btn1 type="button" value="查询" onClick="clickbutton();">
</tr>
</table>
</form>
</BODY>
</HTML> (责任编辑：admin) |
------分隔线----------------------------