DIV图片和文字怎么居中对齐
<div*><im*gsrc="#">哈哈哈</div*>这个Div中文字和图片怎么居中对齐请无视*号不打星号会直接显示出来...
<div*><im*g src="#">哈哈哈</div*>
这个Div中文字和图片怎么居中对齐
请无视*号 不打星号会直接显示出来 展开
这个Div中文字和图片怎么居中对齐
请无视*号 不打星号会直接显示出来 展开
展开全部
兄弟,我给你写了个示例,把下面代码复制过去看看吧:
DIV中怎样让文字跟图片居中对齐的键在于这个属性 vertical-align:middle;
------------------------------------------------------------------------------------
<!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>
<title>无标题页</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td { margin: 0; padding: 0; font-size:12px; }
.clearfix:after { content:'\0020'; display:block; height:0; clear:both; }
.clearfix { *zoom:1;
}
.test { height:100px; width:200px; line-height:100px; border:solid 1px #000; margin:100px auto; padding:0 30px; }
.test img{border:solid 1px #000; vertical-align:middle;}
</style>
</head>
<body>
<div class="test">
这个对齐了<img src="https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/logo-zhidao.gif" />
</div>
</body>
</html>
打字不易,如满意,望采纳。
DIV中怎样让文字跟图片居中对齐的键在于这个属性 vertical-align:middle;
------------------------------------------------------------------------------------
<!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>
<title>无标题页</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td { margin: 0; padding: 0; font-size:12px; }
.clearfix:after { content:'\0020'; display:block; height:0; clear:both; }
.clearfix { *zoom:1;
}
.test { height:100px; width:200px; line-height:100px; border:solid 1px #000; margin:100px auto; padding:0 30px; }
.test img{border:solid 1px #000; vertical-align:middle;}
</style>
</head>
<body>
<div class="test">
这个对齐了<img src="https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/logo-zhidao.gif" />
</div>
</body>
</html>
打字不易,如满意,望采纳。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询