DIV實現(xiàn)input垂直居中兼容IE6和Firefox

發(fā)表日期：2016-01-10 文章編輯：南昌開優(yōu)網(wǎng)絡(luò) 瀏覽次數(shù)：4497 標簽：CSS

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="keywords" content="div垂直居中,div文字垂直居中,div中input垂直居中,JS特效代碼" /> 
<meta name="description" content="DIV實現(xiàn)input垂直居中，兼容IE6、IE7、IE8、Firefox、Safari。更多代碼請訪問開優(yōu)網(wǎng)絡(luò)www.568387.com" /> 
<style type="text/css"> 
body{font-size:12px;} 
.lanrentuku1{ 
border: 1px solid #CCC; 
width:1120px; 
height:40px; 
margin:auto; 
display: table; 
*position: relative; 
overflow: hidden; 
} 

.lanrentuku2 { 
vertical-align: middle; 
display: table-cell; 
*position: absolute; 
*top: 50%; 
} 

.lanrentuku3 { 
*position: relative; 
*top: -50%; 
float:right; 
padding-right:10px; 
} 
</style> 
<title>DIV實現(xiàn)input垂直居中 兼容IE6、IE7、IE8、Firefox、Safari_懶人圖庫</title> 
</head> 

<body><br /><br /><br /> 

<div class="lanrentuku1"> 
<div class="lanrentuku2"> 
<form action="search.php" name="formsearch"> 
<div class="lanrentuku3"> 
<input name="textfield" type="text" size="30"> 
</div> 
</form> 
</div> 
</div> 
<p align="center">DIV實現(xiàn)input垂直居中，兼容IE6、IE7、IE8、Firefox、Safari。</p> 
</body> 
</html>

返回列表

上一篇：網(wǎng)站變灰代碼下一篇：CSS簡單重疊線效果

欧美日韩一区二区三区四区不卡,日韩欧美视频一区二区三区四区,久久精品欧美一区二区三区不卡,国产精品久久久乱弄

DIV實現(xiàn)input垂直居中 兼容IE6和Firefox

DIV實現(xiàn)input垂直居中兼容IE6和Firefox